[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"project-73554":3},{"id":4,"name":5,"fullName":6,"owner":7,"repo":5,"description":8,"homepage":9,"htmlUrl":10,"language":11,"languages":10,"totalLinesOfCode":10,"stars":12,"forks":13,"watchers":14,"openIssues":15,"contributorsCount":16,"subscribersCount":16,"size":16,"stars1d":17,"stars7d":18,"stars30d":19,"stars90d":16,"forks30d":16,"starsTrendScore":20,"compositeScore":21,"rankGlobal":10,"rankLanguage":10,"license":22,"archived":23,"fork":23,"defaultBranch":24,"hasWiki":23,"hasPages":23,"topics":25,"createdAt":10,"pushedAt":10,"updatedAt":42,"readmeContent":43,"aiSummary":44,"trendingCount":16,"starSnapshotCount":16,"syncStatus":45,"lastSyncTime":46,"discoverSource":47},73554,"mediabunny","Vanilagy\u002Fmediabunny","Vanilagy","Pure TypeScript media toolkit for reading, writing, and converting video and audio files, directly in the browser.","https:\u002F\u002Fmediabunny.dev\u002F",null,"TypeScript",6480,251,21,35,0,23,66,647,69,38.2,"Mozilla Public License 2.0",false,"main",[26,27,28,29,30,31,32,33,34,35,36,37,38,39,40,41],"audio","decoding","demuxing","encoding","library","media","mp3","mp4","muxing","npm","ogg","typescript","video","wav","webcodecs","webm","2026-06-12 02:03:15","# Mediabunny - JavaScript media toolkit\n\n[![](https:\u002F\u002Fimg.shields.io\u002Fnpm\u002Fv\u002Fmediabunny)](https:\u002F\u002Fwww.npmjs.com\u002Fpackage\u002Fmediabunny)\n[![](https:\u002F\u002Fimg.shields.io\u002Fbundlephobia\u002Fminzip\u002Fmediabunny)](https:\u002F\u002Fbundlephobia.com\u002Fpackage\u002Fmediabunny)\n[![](https:\u002F\u002Fimg.shields.io\u002Fnpm\u002Fdm\u002Fmediabunny)](https:\u002F\u002Fwww.npmjs.com\u002Fpackage\u002Fmediabunny)\n[![](https:\u002F\u002Fimg.shields.io\u002Fdiscord\u002F1390044844285497344?logo=discord&label=Discord)](https:\u002F\u002Fdiscord.gg\u002FhmpkyYuS4U)\n\n\u003Cdiv align=\"center\">\n    \u003Cimg src=\".\u002Fdocs\u002Fpublic\u002Fmediabunny-logo.svg\" width=\"180\" height=\"180\">\n\u003C\u002Fdiv>\n\nMediabunny is a JavaScript library for reading, writing, and converting media (like MP4, WebM, MP3, HLS), directly in the browser. It aims to be a complete toolkit for high-performance media operations on the web. It's written from scratch in pure TypeScript, has zero dependencies, is very performant, and is extremely tree-shakable, meaning you only include what you use. You can think of it a bit like [FFmpeg](https:\u002F\u002Fffmpeg.org\u002F), but built from the ground up for the web.\n\n[Documentation](https:\u002F\u002Fmediabunny.dev) | [Examples](https:\u002F\u002Fmediabunny.dev\u002Fexamples) | [Sponsoring](#sponsoring) | [License](#license) | [Discord](https:\u002F\u002Fdiscord.gg\u002FhmpkyYuS4U)\n\n### Gold sponsors\n\n\u003Cdiv align=\"center\">\n  \u003Ca href=\"https:\u002F\u002Fremotion.dev\u002F\" target=\"_blank\" rel=\"sponsored\">\n    \u003Cpicture>\n      \u003Csource srcset=\".\u002Fdocs\u002Fpublic\u002Fsponsors\u002Fremotion-dark.png\" media=\"(prefers-color-scheme: dark)\">\n      \u003Cimg src=\".\u002Fdocs\u002Fpublic\u002Fsponsors\u002Fremotion-light.png\" width=\"60\" height=\"60\" alt=\"Remotion\">\n    \u003C\u002Fpicture>\n  \u003C\u002Fa>\n  &nbsp;&nbsp;&nbsp;&nbsp;\n  \u003Ca href=\"https:\u002F\u002Fwww.gling.ai\u002F\" target=\"_blank\" rel=\"sponsored\">\n    \u003Cimg src=\".\u002Fdocs\u002Fpublic\u002Fsponsors\u002Fgling.svg\" width=\"60\" height=\"60\" alt=\"Gling AI\">\n  \u003C\u002Fa>\n  &nbsp;&nbsp;&nbsp;&nbsp;\n  \u003Ca href=\"https:\u002F\u002Fdiffusion.studio\u002F\" target=\"_blank\" rel=\"sponsored\">\n    \u003Cimg src=\".\u002Fdocs\u002Fpublic\u002Fsponsors\u002Fdiffusionstudio.png\" width=\"60\" height=\"60\" alt=\"Diffusion Studio\">\n  \u003C\u002Fa>\n  &nbsp;&nbsp;&nbsp;&nbsp;\n  \u003Ca href=\"https:\u002F\u002Fkino.ai\u002F\" target=\"_blank\" rel=\"sponsored\">\n    \u003Cimg src=\".\u002Fdocs\u002Fpublic\u002Fsponsors\u002Fkino.jpg\" width=\"60\" height=\"60\" alt=\"Kino\">\n  \u003C\u002Fa>\n  &nbsp;&nbsp;&nbsp;&nbsp;\n  \u003Ca href=\"https:\u002F\u002Fscreen.studio\u002F\" target=\"_blank\" rel=\"sponsored\">\n    \u003Cimg src=\".\u002Fdocs\u002Fpublic\u002Fsponsors\u002Fscreen-studio.webp\" width=\"60\" height=\"60\" alt=\"Screen Studio\">\n  \u003C\u002Fa>\n  &nbsp;&nbsp;&nbsp;&nbsp;\n  \u003Ca href=\"https:\u002F\u002Fwww.tella.com\u002F\" target=\"_blank\" rel=\"sponsored\">\n    \u003Cimg src=\".\u002Fdocs\u002Fpublic\u002Fsponsors\u002Ftella.svg\" width=\"60\" height=\"60\" alt=\"Tella\">\n  \u003C\u002Fa>\n\u003C\u002Fdiv>\n\n### Silver sponsors\n\n\u003Cdiv align=\"center\">\n  \u003Ca href=\"https:\u002F\u002Fponder.ai\u002F\" target=\"_blank\" rel=\"sponsored\">\n    \u003Cimg src=\".\u002Fdocs\u002Fpublic\u002Fsponsors\u002Fponder.png\" width=\"50\" height=\"50\" alt=\"Ponder\">\n  \u003C\u002Fa>\n\u003C\u002Fdiv>\n\n### Bronze sponsors\n\n\u003Cdiv align=\"center\">\n  \u003Ca href=\"https:\u002F\u002Felevenlabs.io\u002F\" target=\"_blank\" rel=\"sponsored\">\n    \u003Cimg src=\".\u002Fdocs\u002Fpublic\u002Fsponsors\u002Felevenlabs.png\" width=\"40\" height=\"40\" alt=\"ElevenLabs\">\n  \u003C\u002Fa>\n  &nbsp;&nbsp;&nbsp;&nbsp;\n  \u003Ca href=\"https:\u002F\u002Fwww.reactvideoeditor.com\u002F\" target=\"_blank\" rel=\"sponsored\">\n    \u003Cimg src=\".\u002Fdocs\u002Fpublic\u002Fsponsors\u002Frve.png\" width=\"40\" height=\"40\" alt=\"React Video Editor\">\n  \u003C\u002Fa>\n  &nbsp;&nbsp;&nbsp;&nbsp;\n  \u003Ca href=\"https:\u002F\u002Fwww.mux.com\u002F\" target=\"_blank\" rel=\"sponsored\">\n    \u003Cimg src=\".\u002Fdocs\u002Fpublic\u002Fsponsors\u002Fmux.jpg\" width=\"40\" height=\"40\" alt=\"Mux\">\n  \u003C\u002Fa>\n  &nbsp;&nbsp;&nbsp;&nbsp;\n  \u003Ca href=\"https:\u002F\u002Fjellypod.ai\u002F\" target=\"_blank\" rel=\"sponsored\">\n    \u003Cimg src=\".\u002Fdocs\u002Fpublic\u002Fsponsors\u002Fjellypod.png\" width=\"40\" height=\"40\" alt=\"Jellypod\">\n  \u003C\u002Fa>\n\u003C\u002Fdiv>\n\n[Sponsor Mediabunny's development](https:\u002F\u002Fgithub.com\u002Fsponsors\u002FVanilagy)\n\n## Features\n\nCore features include:\n\n- Wide format support: Read _and_ write MP4, MOV, WebM, MKV, HLS, WAVE, MP3, Ogg, ADTS, FLAC, MPEG-TS\n- Built-in encoding & decoding: Supports 25+ video, audio, and subtitle codecs, hardware-accelerated using the WebCodecs API\n- High precision: Fine-grained, microsecond-accurate reading and writing operations\n- Conversion API: Easy-to-use API with features such as transmuxing, transcoding, resizing, rotation, cropping, resampling, trimming, and more\n- Streaming I\u002FO: Handle reading & writing files of any size with memory-efficient streaming\n- Cross-platform: Works in all browsers as well as in Node, Bun, and Deno using [`@mediabunny\u002Fserver`](https:\u002F\u002Fgithub.com\u002FVanilagy\u002Fmediabunny\u002Fblob\u002Fmain\u002Fpackages\u002Fserver\u002FREADME.md)\n- Tree-shakable: Only bundle what you use (as small as 5 kB gzipped)\n- Zero dependencies: Implemented in highly performant TypeScript\n\n[See full feature list](https:\u002F\u002Fmediabunny.dev\u002Fguide\u002Fintroduction#features)\n\n## Quick start\n\n### Installation\n\nInstall it via npm:\n\n```bash\nnpm install mediabunny\n```\n\nAlternatively, include it directly with a script tag using one of the [builds](https:\u002F\u002Fgithub.com\u002FVanilagy\u002Fmediabunny\u002Freleases). Doing so exposes a global `Mediabunny` object.\n```html\n\u003Cscript src=\"mediabunny.cjs\">\u003C\u002Fscript>\n```\n\nRequires any JavaScript environment that can run ECMAScript 2021 or later. Mediabunny is expected to be run in modern browsers. For types, TypeScript 5.7 or later is required.\n\n### Read file metadata\n\n```js\nimport { Input, ALL_FORMATS, BlobSource } from 'mediabunny';\n\n\u002F\u002F Reading from disk\nconst input = new Input({\n    source: new BlobSource(file),\n    formats: ALL_FORMATS,\n});\n\nconst duration = await input.computeDuration(); \u002F\u002F in seconds\nconst videoTrack = await input.getPrimaryVideoTrack();\nconst audioTrack = await input.getPrimaryAudioTrack();\n\nconst displayWidth = await videoTrack.getDisplayWidth();\nconst displayHeight = await videoTrack.getDisplayHeight();\nconst rotation = await videoTrack.getRotation();\n\nconst sampleRate = await audioTrack.getSampleRate();\nconst numberOfChannels = await audioTrack.getNumberOfChannels();\n\nconst { title, artist, album } = await input.getMetadataTags();\n```\n\n### Create new media files\n\n```js\nimport { Output, Mp4OutputFormat, BufferTarget, CanvasSource, QUALITY_HIGH } from 'mediabunny';\n\nconst output = new Output({\n    format: new Mp4OutputFormat(),\n    target: new BufferTarget(), \u002F\u002F Writing to memory\n});\n\n\u002F\u002F Add a video track backed by a canvas element\nconst videoSource = new CanvasSource(canvas, {\n    codec: 'avc',\n    bitrate: QUALITY_HIGH,\n});\noutput.addVideoTrack(videoSource);\n\nawait output.start();\n\u002F\u002F Add frames...\nawait output.finalize();\n\nconst buffer = output.target.buffer; \u002F\u002F Final MP4 file\n```\n\n### Convert files\n\n```js\nimport { Input, Output, Conversion, ALL_FORMATS, BlobSource, WebMOutputFormat } from 'mediabunny';\n\nconst input = new Input({\n    source: new BlobSource(file),\n    formats: ALL_FORMATS,\n});\n\nconst output = new Output({\n    format: new WebMOutputFormat(), \u002F\u002F Convert to WebM\n    target: new BufferTarget(),\n});\n\nconst conversion = await Conversion.init({ input, output });\nawait conversion.execute();\n```\n\n[See more code snippets](https:\u002F\u002Fmediabunny.dev\u002Fguide\u002Fquick-start)\n\n## Documentation\n\nVisit the [Docs](https:\u002F\u002Fmediabunny.dev\u002Fguide\u002Fintroduction) for comprehensive guides, examples and API documentation.\n\n## Sponsoring\n\n[See all sponsors](https:\u002F\u002Fmediabunny.dev\u002F#sponsors)\n\nMediabunny is an open-source project released under the \u003Ca href=\"https:\u002F\u002Fchoosealicense.com\u002Flicenses\u002Fmpl-2.0\u002F\" target=\"_blank\">MPL-2.0\u003C\u002Fa> and is therefore free to use for any purpose, including closed-source commercial use. A permissive license is essential for a foundational library like this to truly thrive. That said, this project requires an immense amount of work and care to maintain and expand. This is made possible by the generous financial backing of the sponsors of this project.\n\nIf you have derived considerable value from this project, please consider [sponsoring it](https:\u002F\u002Fgithub.com\u002Fsponsors\u002FVanilagy) or providing a one-time donation. Thank you! 🩷\n\n## License\n\nThis project is licensed under the [Mozilla Public License 2.0](https:\u002F\u002Fchoosealicense.com\u002Flicenses\u002Fmpl-2.0\u002F). This is a very permissive weak copyleft license, not much different from the MIT License, allowing you to:\n- Use Mediabunny for any purpose, commercial or non-commercial, without royalties\n- Use Mediabunny in open- and closed-source projects\n- Freely distribute projects built with Mediabunny\n- Inspect and modify Mediabunny's source code\n\nHowever, you have the following obligation:\n- If you modify Mediabunny's licensed source code (e.g. in a fork) and then distribute it, you must publicly publish your modifications under the Mozilla Public License 2.0.\n\nThis ensures that library usage remains permissive for everybody, while any improvements to Mediabunny remain in the open, benefiting everyone.\n\nYou are not allowed to:\n- Remove the license and copyright headers from any Mediabunny source file\n- Claim the \"Mediabunny\" trademark\n\nAnd finally, Mediabunny - like any other library - comes with no warranty of any kind and is not liable for any direct or indirect damages.\n\n> This is not legal advice. Refer to the full text of the [Mozilla Public License 2.0](https:\u002F\u002Fchoosealicense.com\u002Flicenses\u002Fmpl-2.0\u002F) for the binding license agreement.\n\n## Implementation & development\n\nMediabunny is implemented from scratch in pure TypeScript with zero dependencies. At its core, the library is a collection of multiplexers and demultiplexers (one for every container format), which are then connected together via abstractions around the WebCodecs API. The logic is heavily pipelined and lazy, keeping performance high and memory usage low. If this stuff interests you, refer to the [Technical overview](https:\u002F\u002Fmediabunny.dev\u002Fguide\u002Fintroduction#technical-overview) for more.\n\nFor development, clone this repository and install it using a modern version of Node.js and npm. The build system uses TypeScript, esbuild, API Extractor, Vite, and VitePress.\n\n```bash\nnpm install # Install dependencies\nnpm run watch # Build bundles on watch mode\n\nnpm run build # Production build with type definitions\n\nnpm run check # Type checking\nnpm run lint # ESLint\n\nnpm run docs:generate # Generates API docs\nnpm run docs:dev # Start docs development server\nnpm run dev # Start examples development server, will run at http:\u002F\u002Flocalhost:5173\u002Fexamples\u002F[name]\u002F\n  \nnpm run docs:build # Build docs and examples\n```","Mediabunny 是一个用于在浏览器中读取、写入和转换媒体文件（如 MP4、WebM、MP3、HLS）的 JavaScript 库。其核心功能包括解码、编码、复用与解复用音频和视频流，支持多种常见格式。该库完全使用 TypeScript 从零编写，无任何外部依赖，具有高性能且高度可裁剪的特点，用户只需引入实际使用的部分代码。适用于需要直接在客户端进行多媒体处理的各种 Web 应用场景，例如在线编辑器、流媒体服务或任何对性能有较高要求的前端项目。",2,"2026-06-11 03:46:07","high_star"]