首页 > 编程语言 >大神的纯H5前端程序能将视频压缩92%?我测试研究了下,给大家汇报下

大神的纯H5前端程序能将视频压缩92%?我测试研究了下,给大家汇报下

时间:2024-08-02 11:20:24浏览次数:11  
标签:视频 浏览器 ffmpeg 视频压缩 92% H5 wasm 工具

今天在网上看到一国外牛人开发的一个小工具,可以将视频压缩后尺寸缩小92%,而且从其UI界面的左右两侧,压缩前和压缩后的视频对比来看,看不出明显的质量损失。

video-compress-92%

视频压缩工具

➡️https://tools.rotato.app/compress

实际测试

我马上打开这个工具,选择自己的视频做了个测试,第一个视频从168.5M缩小到了31.2M,缩小了76,第二个视频缩小了46%,表现还不错。

对比压缩前和压缩后的文件,可以看到视频的分辨率,帧率都没有变,但码率从2.5M减小到了0.6M。

 

实现原理分析

这个工具是个网页,就习惯性打开浏览器的调试界面,分析了下其代码,发现其使用了ffmpeg.wasm, 打开这个ffmpeg.wasm的官方网站一看,发现是将ffmpeg这个命令行工具包装成了wasm, 这样就可以让ffmpeg在浏览器中被Javascript调用执行了,这个脑洞开的有点大。 Ffmpeg能在浏览器中运行,我以前是不知道的,学到了。

 

WebAssembly(wasm)可以让c, c++, go, java, c#, python等高级语言代码在浏览器中高效运行, 适合游戏,图像处理,视频编辑等计算密集型的任务。以前有了解,但没有看到合适的杀手应用。

 

WebAssembly下载到浏览器中后,还是要通过javascript调用,点击源代码,到这里看,可以看到其调用ffmpeg所使用的命令。

 -c:v libx264 -tag:v avc1 -movflags faststart -crf 30 -preset superfast

延伸

回到Rotato的首页,看到还有其他工具,你看这个视频编辑工具,可以在浏览器中,直接编辑制作视频,使用各种特效,最终下载保存视频。

➡️大神的视频创作工具:

https://video.rotato.app/edit/promo

看来以后可以自己实现一个比YouTube视频编辑更强的工具,而且是在本地浏览器运行的。我之前视频提到过avif动图的制作,其中一种方法就是用ffmpeg命令实现,看来可以做个有WebUI的avif制作工具。

标签:视频,浏览器,ffmpeg,视频压缩,92%,H5,wasm,工具
From: https://www.cnblogs.com/jopny/p/18335933/ffmpeg-webasm-js

相关文章

  • uni-app h5 使用微信JSSDK的方式
    综合各方经验及文档总结了以下我的使用方法,希望对有需要的同学有些帮助第一步:npminstalljweixin-module--save第二步:common文件夹新建js文件,我这里命名jwx.js jwx.js文件内容varjWeixin=require('jweixin-module');exportdefault{//判断是否在微信中......
  • [题解]P6927 [ICPC2016 WF] Swap Space
    思路显然要按\(a_i,b_i\)的大小关系分类:\(a_i<b_i\):假令有两对数\((a_1,b_1),(a_2,b_2)\),且\(a_1\leqa_2\)。如果\(b_1\geqa_2\)。则按照12的顺序,将带来\(a_1\)的花费,以及\(b_1+b_2\)的额外空间;而按照21的顺序,将带来\(a_2\)的花费,以及\(b_1+b_2......
  • PHP源码_最新同城上门家政按摩H5小程序源码_上门预约系统
    后端thinkphp框架开发。前端采用uni-app开发,适配多端(小程序+公众号H5+APP)此套源码并非网上免费流传版本,自掏腰包购入,完整无错不需要授权!项目运行截图源码贡献https://githubs.xyz/boot?app=43功能介绍1、数据概况(新增业务城市用户投票功能,更加直观的查看业务城市的关注......
  • [米联客-安路飞龙DR1-FPSOC] FPGA基础篇连载-25 ADC模块FEP-DAQ9248采集显示波形方案
    软件版本:Anlogic-TD5.9.1-DR1_ES1.1操作系统:WIN1064bit硬件平台:适用安路(Anlogic)FPGA实验平台:米联客-MLK-L1-CZ06-DR1M90G开发板板卡获取平台:https://milianke.tmall.com/登录"米联客"FPGA社区http://www.uisrc.com视频课程、答疑解惑! 1概述本方案通过把DAQ9......
  • uniapp 全局挂载弹窗组件(app、h5)
    自定义标题栏在标题栏里写弹窗组件,每个页面都会引入标题栏所以每个页面都可以调用标题栏组件<u-modalref="errModal" :show="modalShow" :title="modalTitle" :showCancelButton="showCancelButton" :cancelText="cancelText" :confirmText="co......
  • 基于ads1292的心电信号采集之芯片关键点备忘
    一前记团队在作基于ads1292的心电数据采集时候,遇到了一些问题。这里做一个记录和备忘。也希望能帮的到同样遇到困难的朋友。 二关注点1reset引脚不能悬空,这个悬空的时候,笔者发现ads1292无法正常工作。  2.start信号在单独使用的时候,不要接GND......
  • 千千蓝鲸2924
    描述斐波那契数列:数列的第一个值和第二个值都为1,接下来每个数都等于前两个数的和。求第n个数是多少?输入描述一个整数n,表示要求的第n位。(1<n<90)注意数据大小!!!输出描述一个整数,第n位的数字。样例输入120样例输出16765AC代码:#include<iostream>typedeflonglong......
  • Codeforces Round 929 (Div. 3)---->E. Turtle vs. Rabbit Race: Optimal Trainings
    https://codeforces.com/contest/1933/problem/E#include<bits/stdc++.h>#definexfirst#defineysecondusingnamespacestd;typedeflonglongll;typedef__int128i128;typedefpair<int,int>pii;constintN=2e5+10,M=110;intn,q;inta[N];ll......
  • CH573RTC
    代码参考:#include"CH57x_common.h"voidDebugInit(void){GPIOA_SetBits(GPIO_Pin_9);GPIOA_ModeCfg(GPIO_Pin_9,GPIO_ModeOut_PP_5mA);UART1_DefInit();}intmain(){SetSysClock(CLK_SOURCE_PLL_60MHz);GPIOA_ModeCfg(GPIO_Pin_Al......
  • Windows下捕获6GHz报文/无线抓包(WiFi6E网卡mt7921au)
    目录16GHz概述1.16GHz与WiFi6E1.26GHz国际使用情况1.36GHz中国使用情况1.46GHz信道一览表26GHz抓包操作2.1抓包网卡推荐2.2抓包软件使用2.2.1VMware虚拟机安装2.2.2WinSniffer程序使用2.2.3WireShark远程抓包2.3扫描软件推荐2.3.1Windows2.3.2WiFi......