- 综合排序
- 最热优先
- 最新优先
- 来自专栏智影Yodonicc
编译WebAssembly版本的FFmpeg（ffmpeg.wasm）：（4）ffmpeg.wasm v0.2 - 添加Libx264
作者：Jerome Wu 原文链接：Build FFmpeg WebAssembly version (= ffmpeg.wasm): Part.4 ffmpeg.wasm v0.2 — Add Libx264 译者：Yodoxu 上一篇文章：编译WebAssembly版本的FFmpeg（ffmpeg.wasm）：（3）ffmpeg.wasm v0.1 - 将avi转为mp4的编码 在这一部分中，你将学习： 有了所有的脚本，现在你可以用x264构建ffmpeg.wasm（也可能是所有其他的库。） 在浏览器中的ffmpeg.wasm demo 这篇文章的最后一部分是ffmpeg.wasm v0.2的演示，场景是创建一个网页，使用户能够上传一个视频文件（例如avi）并在网页浏览器中播放。 由于不可能直接播放avi文件，我们将使用ffmpeg.wasm先对视频进行转码。 以下是完整的HTML代码（按这里下载样本视频）。
2K103编辑于 2022-04-14 - 来自专栏智影Yodonicc
编译WebAssembly版本的FFmpeg（ffmpeg.wasm）：（3）ffmpeg.wasm v0.1 - 将avi转为mp4的编码
作者：Jerome Wu 原文链接：Build FFmpeg WebAssembly version (= ffmpeg.wasm): Part.3 ffmpeg.wasm v0.1 — Transcoding 与ffmpeg.wasm进行交互 管理Emscripten文件系统。 开发具有转码功能的ffmpeg.wasm v0.1。 建立一个带有优化参数的FFmpeg库版本。 与ffmpeg.wasm互动 为了确保ffmpeg.wasm的工作，让我们尝试在ffmpeg.wasm中实现以下命令。 现在我们能够向ffmpeg.wasm传递参数并将文件保存到文件系统中，让我们将所有这些参数组合起来，让我们的ffmpeg.wasm v0.1工作起来。 ）：（4）ffmpeg.wasm v0.2 增加Libx264库改进它。
1.4K31编辑于 2022-04-15 - 来自专栏前端开发随笔
ffmpeg.wasm前端实现多张图片合成视频
该功能主要是借助了ffmpeg这个库实现 该项目是由vite+vue3创建的 首先进行ffmpeg安装
2.4K40编辑于 2022-07-08 - 来自专栏智影Yodonicc
编译WebAssembly版本的FFmpeg（ffmpeg.wasm）：（5）ffmpeg.wasm v0.3 - pre.js与实时音视频流
作者：Jerome Wu 原文链接：Build FFmpeg WebAssembly version (= ffmpeg.wasm): Part.5 ffmpeg.wasm v0.3 — pre-js and live streaming (OUTDATED) 译者：Yodonicc 上一篇文章：编译WebAssembly版本的FFmpeg（ffmpeg.wasm）：（4）ffmpeg.wasm v0.2 在第六篇文章中，我们将对文件系统进行深入研究：编译WebAssembly版本的FFmpeg（ffmpeg.wasm）：(6) 深入研究文件系统 代码目录： ffmpeg-core.js: https:/
3.4K83编辑于 2022-04-16 - 来自专栏智影Yodonicc
编译WebAssembly版本的FFmpeg（ffmpeg.wasm）：（1）准备
编译WebAssembly版本的FFmpeg（ffmpeg.wasm）：（1）准备 作者：Jerome Wu 原文链接：Build FFmpeg WebAssembly version (= ffmpeg.wasm https://github.com/ffmpegwasm/FFmpeg/releases/tag/n4.3.1-p1 现在我们已经完成了准备工作，让我们继续编译WebAssembly版本的FFmpeg（ ffmpeg.wasm
3.3K82编辑于 2022-04-15 - 来自专栏智影Yodonicc
编译WebAssembly版本的FFmpeg（ffmpeg.wasm）：（2）使用Emscripten编译
编译WebAssembly版本的FFmpeg（ffmpeg.wasm）：（2）使用Emscripten编译 作者：Jerome Wu 原文链接：Build FFmpeg WebAssembly version (= ffmpeg.wasm): Part.2 Compile with Emscripten 译者：Yodoxu 2020/9更新：修改教程，使其能在MacOS中运行。 /configure "${ARGS[@]}" # build ffmpeg.wasm emmake make -j4 然后它运行完立马报错： ... . 你可以看到它的输出与原来的FFmpeg相似，它给了我们一个很好的起点来打磨我们的ffmpeg.wasm库。 库，请关注编译WebAssembly版本的FFmpeg（ ffmpeg.wasm）：（3） ffmpeg.wasm v0.1 - 将avi转为mp4的新一篇文章。
2.7K73编辑于 2022-04-15 - 来自专栏智影Yodonicc
编译WebAssembly版本的FFmpeg（ffmpeg.wasm）：(6)深入研究文件系统
作者：Jerome Wu 原文链接：Build FFmpeg WebAssembly version (= ffmpeg.wasm): Part.6 a Deep Dive into File System 上一篇文章：编译WebAssembly版本的FFmpeg（ffmpeg.wasm）：（5）ffmpeg.wasm v0.3 - pre.js与实时音视频流 在这一部分中，你将学习： MEMFS、IDBFS 解决一个现实世界（工程）的问题：ffmepg.js文件大小限制 有一天，有一个问题报告说ffmpeg.wasm不能处理大文件。为了解决这个问题，我们首先重新审视我们的设计。 虽然它看起来比较复杂，但它解决了ffmpeg.wasm中处理大文件的问题。 ffmpeg.wasm 注：特别感谢技术指导dazhao(赵达)对本文翻译的审阅指正。
2.8K63编辑于 2022-04-18 - 来自专栏多媒体工具
前端使用 ffmpeg.wasm 合并 TS 文件（浏览器 FFmpeg 实战）
于是我尝试用ffmpeg.wasm做了一个浏览器端TS合并工具，让整个流程变成：拖入TS文件→点击合并→下载MP4不需要安装软件，也不需要上传视频到服务器。 三、ffmpeg.wasm：让浏览器运行FFmpeg为了解决这个问题，我选择了ffmpeg.wasm。简单来说，它做了一件很有意思的事情：把FFmpeg编译成WebAssembly。 六、浏览器端视频处理的优势使用ffmpeg.wasm做视频工具，其实有几个非常明显的优势。 2wasm首次加载较慢首次加载ffmpeg.wasm：需要下载十几MB可以通过：CDN缓存优化体验。八、总结以前做视频处理：需要安装软件、写命令、配置环境。 现在通过ffmpeg.wasm，浏览器本身就可以成为一个轻量级的视频处理平台。像TS合并这种常见需求，其实只需要：文件上传concat列表FFmpeg执行三步就能完成。
10610编辑于 2026-03-06 - 来自专栏一尾流莺学前端
【实战技巧】前端利用 ffmpeg 播放本地视频
https://github.com/ffmpegwasm/ffmpeg.wasm/blob/master/docs/api.md 前言 使用到的第三方库： ffmpeg.wasm npm 上包名叫这个 @ffmpeg/ffmpeg ffmpeg.wasm 先来学习一下这个库的基本用法，全部的 API 都在下面了。 对于 ffmpeg.wasm 的输入/输出文件，需要先将它们保存到 MEMFS 以便 ffmpeg.wasm 能够使用它们。这里我们依赖 Emscripten 提供的 FS 方法♂️。 ffmpeg.setLogging(true); ffmpeg.setLogger ffmpeg.setLogger(logger) 设置和获取 ffmpeg.wasm 的输出消息。。 这个函数帮助你获取文件并返回一个 Uint8Array 变量供 ffmpeg.wasm 使用。
5.1K30编辑于 2022-12-10 webcodes vs ffmpeg 哪个更适合做在线云剪辑？
ffmpeg.wasm浏览器兼容性一般。是较新的API，在Chrome、Edge等Chromium浏览器中支持良好，但在Firefox和Safari中支持有限或正在逐步实现。良好。 只要浏览器支持WebAssembly（现在几乎所有现代浏览器都支持），ffmpeg.wasm就能运行。兼容性问题较少。 ffmpeg.wasm可以看到，做云剪辑ffmpeg.wasm的优势有：格式支持多、浏览器兼容性好，但是除开这两个有点其他都是缺点。
21400编辑于 2025-11-27- 来自专栏腾讯IVWEB团队的专栏
IVWEB玩转wasm系列-纯web视频剪辑/转换工具
最终文件的输出会是ffmpeg.wasm和ffmpeg.js, 胶水代码的大小为250k，ffmpeg.wasm的大小为5m，videoconverter的输出js大小为26m，相比之下小了很多，并且ffmpeg.wasm playlist.m3u8', '-ss', 重新计算出得起始时间, '-t', '180', input.m3u8', '-c', 'copy', 'output.mp4'] }); 回放视频已经拆分成一个个视频片段，那么ffmpeg.wasm ', file.name, file.data, true, true); } 遍历传入的files，createDataFile传入指定的文件名和文件ArrayBufer数据，就可以创建文件，在ffmpeg.wasm
3.4K31发布于 2020-06-27 - 来自专栏GoCoding
RTSP H264 流 MSE 播放
4]: 可直接捕获客户端视频流，并点对点传输、不依赖服务器中转 WebCodecs[5]: 编解码音视频 WebAssembly[6]: C/C++/Rust 等编译进前端使用 ffmpegwasm/ffmpeg.wasm WebCodecs: https://github.com/w3c/webcodecs [6] WebAssembly: https://webassembly.org/ [7] ffmpegwasm/ffmpeg.wasm : https://github.com/ffmpegwasm/ffmpeg.wasm [8] GoogleChromeLabs/webm-wasm: https://github.com/GoogleChromeLabs
2.9K30发布于 2021-07-20 - 来自专栏腾讯IMWeb前端团队
使用 FFmpeg 与 WebAssembly 实现纯前端视频截帧
下面我们从如何安装 Emscripten 开始讲起，到编译 FFmpeg，构建出 ffmpeg.wasm，从而可以在浏览器执行。 构建 ffmpeg.wasm 通过 Emscripten 构建 FFmpeg.wasm，目前主流的方案有两种： (1) 整体编译 FFmpeg, 加上 pre.js post.js 包裹胶水代码，跟 wasm # 构建依赖，生成ffmpeg.bc二进制产物 emmake make -j4 # 构建ffmpeg.wasm emcc -O2 -s ASSERTIONS=1 -s VERBOSE 部署上线 本地开发可以跑通，接下来进行部署上线，项目使用 webpack 打包，假设项目中相关的目录结构如下： src ├─ffmpeg │ ├─wasm │ │ ├─ffmpeg.wasm │ │ ├─ffmpeg.min.js │ ├─ffmpeg.worker.js // 封装截帧功能，同时引入并初始化ffmpeg.min.js，并引入ffmpeg.wasm │ ├─index.js
5.7K21编辑于 2022-06-29 - 来自专栏柒八九技术收纳盒
宝贝，带上WebAssembly，换个姿势来优化你的前端应用
「专注于前端开发技术/Rust及AI应用知识分享」的Coder ❝此篇文章所涉及到的技术有 WebAssembly Rust Web Worker(comlink) wasm-pack Photon ffmpeg.wasm (当然，我们后期也会有专门的文章) 在这里我们介绍一种wasm库-ffmpeg.wasm[10] ❝ffmpeg.wasm 是 FFmpeg[11] 的针对 WebAssembly / JavaScript https://juejin.cn/post/6923953599936954382 [9] Photon: https://github.com/silvia-odwyer/photon [10] ffmpeg.wasm
1K11编辑于 2024-06-07 - 来自专栏token的技术分享
Blazor资源大全，很棒的Blazor（1）
FFmpegBlazor[143] - FFmpegBlazor提供了在Blazor Wasm C#中利用ffmpeg.wasm的能力。 ffmpeg.wasm[144] 是FFmpeg的纯Webassembly / Javascript端口。它使得在浏览器内部能够进行视频和音频的录制、转换和流媒体处理。 github.com/Nethereum/NethereumBlazor [143] FFmpegBlazor: https://github.com/sps014/FFmpegBlazor [144] ffmpeg.wasm : https://github.com/ffmpegwasm/ffmpeg.wasm [145] Blazor Studio: https://github.com/huntercfreeman/BlazorStudio
2.7K50编辑于 2023-10-13 - 来自专栏WflynnWeb
使用navigator.connection.downlink前端测网速
例如最近在使用ffmpeg.wasm做一些事情，ffmpeg.wasm的核心JS代码有20多M，这个文件的加载实在整个业务代码内部的，并没有加载进度的暴露，自己没法制作精准的loading效果，于是想到的就是判断当前网速
1.7K20编辑于 2022-10-28 - 来自专栏翩翩白衣少年
前端工程师狂喜！WebAV：B站开源的浏览器端视频编辑神器，一款前端SDK
高性能 在性能方面，WebAV 借助 WebCodecs 实现了令人惊叹的表现，官方数据表明它的性能是 ffmpeg.wasm 的 20 倍，并且几乎接近原生的计算效率。
2.7K10编辑于 2024-10-31 - 来自专栏code秘密花园
Wasm 为 Web 开发带来无限可能
借助 WebAssembly 的能力，它现在有了一个 Web 版本：FFMPEG.WASM，让你可以在浏览器里处理视频，你可以到下面这个网址上去体验一下： https://ffmpegwasm.netlify.app
2.2K40发布于 2021-11-24 - 来自专栏前端Q
120 行代码实现纯 Web 剪辑视频
编译 ffmpeg 成 wasm 存在较多的环境问题，所以我们这次直接使用在线已经编译好的 CDN 资源 这边就直接使用了这个比较成熟的库 https://github.com/ffmpegwasm/ffmpeg.wasm
1.1K10发布于 2021-09-17 - 来自专栏编程小白狼
MP4视频加载报错处理的全面解决方案
{ // 检查文件是否已经优化 if (await this.isOptimized(file)) { return file; } // 使用FFmpeg.wasm
99910编辑于 2025-10-18
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号