Repolode
提交项目
Vanilagy

Vanilagy/mediabunny

纯 TypeScript 编写的零依赖库，可在浏览器中读取、写入和转换 MP4、WebM、MP3 等音视频文件。

在 GitHub 查看官网
Star
7,441
Fork
339
未关闭 Issue
53
最近提交
22小时前

这是什么？

Mediabunny 是一个 JavaScript 库，可直接在浏览器中读取、写入和转换 MP4、WebM、MP3、HLS 等媒体文件。它完全使用 TypeScript 从零实现，没有任何依赖，定位是面向 Web 的媒体处理工具，思路上类似命令行工具 FFmpeg。

库内实现了 MOV、MKV、WAV、Ogg、FLAC、MPEG-TS 等多种容器格式的解复用与复用，支持 25 种以上的视频、音频和字幕编解码器。编解码基于 WebCodecs API，在环境支持时可使用硬件加速。转换 API 涵盖转封装、转码、缩放、旋转、裁剪、重采样和裁切等操作。

文件读写采用流式方式，处理大文件时无需将全部内容载入内存。包体支持 Tree-shaking，最小构建体积约 5 kB（gzip）。通过单独的 @mediabunny/server 包，同一套代码也可运行在 Node、Bun 和 Deno 中。

核心功能

  • 01支持读写 MP4、MOV、WebM、MKV、HLS、WAV、MP3、Ogg、ADTS、FLAC 和 MPEG-TS。
  • 02支持 25 种以上视频、音频和字幕编解码器，借助 WebCodecs 实现硬件加速。
  • 03提供转封装、转码、缩放、裁剪、旋转和裁切等转换 API。
  • 04采用流式读写，可处理任意大小的文件。
  • 05支持 Tree-shaking，无运行时依赖，最小体积约 5 kB（gzip）。
  • 06可在浏览器中运行，并通过 @mediabunny/server 在 Node、Bun 和 Deno 中使用。

适用场景

  • 在上传到服务器前，于浏览器中把用户视频转换为 WebM 或 MP4。
  • 在 Web 应用中读取媒体文件的时长、分辨率、旋转角度和元数据标签。
  • 将 Canvas 逐帧绘制的内容直接在浏览器中生成 MP4 视频。
  • 在基于浏览器的视频编辑器中对片段进行裁剪或缩放。

快速上手

  1. 1

    通过 npm 安装该包

    npm install mediabunny
  2. 2

    导入 Input、ALL_FORMATS 和 BlobSource，从文件中读取元数据

使用前须知

  • 主要面向浏览器运行，硬件加速编解码依赖 WebCodecs API。
  • 如需类型支持，要求 TypeScript 5.7 或更高版本。

标签

#video#audio#webcodecs#typescript#media-processing#transcoding#browser#mp4#decoding#demuxing

常见问题

mediabunny 是什么？
纯 TypeScript 编写的零依赖库，可在浏览器中读取、写入和转换 MP4、WebM、MP3 等音视频文件。 Mediabunny 是一个 JavaScript 库，可直接在浏览器中读取、写入和转换 MP4、WebM、MP3、HLS 等媒体文件。它完全使用 TypeScript 从零实现，没有任何依赖，定位是面向 Web 的媒体处理工具，思路上类似命令行工具 FFmpeg。
mediabunny 可以免费使用吗？用的什么许可证？
mediabunny 以 MPL-2.0 许可证开源。用于商业产品前，请先确认许可证条款。
mediabunny 还在维护吗？
活跃维护中。mediabunny 最近一次提交是在 2026年11月6日。
mediabunny 适合用来做什么？
在上传到服务器前，于浏览器中把用户视频转换为 WebM 或 MP4。 在 Web 应用中读取媒体文件的时长、分辨率、旋转角度和元数据标签。 将 Canvas 逐帧绘制的内容直接在浏览器中生成 MP4 视频。 在基于浏览器的视频编辑器中对片段进行裁剪或缩放。
mediabunny 怎么安装和运行？
通过 npm 安装该包: npm install mediabunny 导入 Input、ALL_FORMATS 和 BlobSource，从文件中读取元数据
在哪里获取 mediabunny？
源代码和安装说明在 GitHub 上：https://github.com/Vanilagy/mediabunny

概要由 AI 根据项目 README 生成；GitHub 数据每日更新。

相关项目