Be more graceful with unsupported edit lists

Center bunny, add bisky
Clarify built distribution files in docs
2026-10-05 06:43:48 +02:00 · 2025-07-10 17:33:10 +02:00 · 2025-07-10 11:39:02 +02:00 · 2025-07-09 12:14:29 +02:00 · 2025-07-09 12:05:33 +02:00 · 2025-07-09 11:59:32 +02:00
24 changed files with 86 additions and 84 deletions
@@ -10,6 +10,6 @@ indent_size = 2
 indent_style = space
 indent_size = 4

-[*.yaml]
+[*.yml]
 indent_style = space
 indent_size = 2
@@ -2,6 +2,7 @@ name: Lint

 on:
  push:
+  pull_request:

 jobs:
  lint:
@@ -11,9 +11,7 @@ jobs:
  release:
    name: Release
    runs-on: ubuntu-latest
-    permissions:
-      contents: read
-      id-token: write
+    permissions: write-all
    steps:
      - name: Checkout repository
        uses: actions/checkout@v4
@@ -41,6 +39,11 @@ jobs:
      - name: Run build
        run: npm run build

+      - name: Upload build artifacts
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        run: gh release upload ${{ github.event.release.tag_name }} dist/bundles/mediabunny.cjs dist/bundles/mediabunny.min.cjs dist/bundles/mediabunny.mjs dist/bundles/mediabunny.min.mjs dist/mediabunny.d.ts
+
      - name: Create Publish to npm
        run: npm publish --provenance
        env:
@@ -1,5 +1,4 @@
 /node_modules
-/build
 /dist
 /dist-docs
 .DS_Store
@@ -5,7 +5,7 @@
 [![](https://img.shields.io/npm/dm/mediabunny)](https://www.npmjs.com/package/mediabunny)

 <div align="center">
-    <img src="./docs/public/mediabunny-logo.svg" height="180">
+    <img src="./docs/public/mediabunny-logo.svg" width="180" height="180">
 </div>

 Mediabunny is a JavaScript library for reading, writing, and converting media files (like MP4, WebM, MP3), 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://ffmpeg.org/), but built from the ground up for the web.
@@ -16,11 +16,11 @@ Mediabunny is a JavaScript library for reading, writing, and converting media fi

 <div align="center">
  <a href="https://www.gling.ai/" target="_blank">
-    <img src="./docs/public/sponsors/gling.svg" height="60" alt="Gling AI">
+    <img src="./docs/public/sponsors/gling.svg" width="60" height="60" alt="Gling AI">
  </a>
  &nbsp;&nbsp;&nbsp;&nbsp;
  <a href="https://diffusion.studio/" target="_blank">
-    <img src="./docs/public/sponsors/diffusionstudio.png" height="60" alt="Diffusion Studio">
+    <img src="./docs/public/sponsors/diffusionstudio.png" width="60" height="60" alt="Diffusion Studio">
  </a>
 </div>

@@ -152,7 +152,7 @@ For development, clone this repository and install it using a modern version of

 ```bash
 npm install # Install dependencies
-npm run watch # Development build with watch mode
+npm run watch # Build bundles on watch mode

 npm run build # Production build with type definitions

@@ -1,6 +1,6 @@
 {
  "$schema": "https://developer.microsoft.com/json-schemas/api-extractor/v7/api-extractor.schema.json",
-  "mainEntryPointFilePath": "build/index.d.ts",
+  "mainEntryPointFilePath": "dist/modules/index.d.ts",
  "bundledPackages": [],
  "compiler": {},
  "apiReport": {
@@ -37,20 +37,20 @@ const esmConfig = {

 const ctxUmd = await esbuild.context({
 	...umdConfig,
-	outfile: 'dist/mediabunny.js',
+	outfile: 'dist/bundles/mediabunny.cjs',
 });
 const ctxEsm = await esbuild.context({
 	...esmConfig,
-	outfile: 'dist/mediabunny.mjs',
+	outfile: 'dist/bundles/mediabunny.mjs',
 });
 const ctxUmdMinified = await esbuild.context({
 	...umdConfig,
-	outfile: 'dist/mediabunny.min.js',
+	outfile: 'dist/bundles/mediabunny.min.cjs',
 	minify: true,
 });
 const ctxEsmMinified = await esbuild.context({
 	...esmConfig,
-	outfile: 'dist/mediabunny.min.mjs',
+	outfile: 'dist/bundles/mediabunny.min.mjs',
 	minify: true,
 });

@@ -1,6 +1,6 @@
 <!DOCTYPE html>

-<script src="../dist/mediabunny.js"></script>
+<script src="../dist/bundles/mediabunny.cjs"></script>

 <script type="module">
 	const fileInput = document.createElement('input');
@@ -21,7 +21,7 @@
 			chunked: true,
 			chunkSize: 2**20
 		});
-		const outputFormat = new Mediabunny.MovOutputFormat();
+		const outputFormat = new Mediabunny.Mp4OutputFormat();

 		const button = document.createElement('button');
 		button.textContent = 'Cancel';
@@ -38,7 +38,8 @@
 				target
 			}),
 			audio: {
-				codec: 'pcm-f64'
+				codec: 'opus',
+				bitrate: 128000,
 				//numberOfChannels: 1,
 				//sampleRate: 4000
 				//discard: true
@@ -1,6 +1,6 @@
 <!DOCTYPE html>

-<script src="../dist/mediabunny.js"></script>
+<script src="../dist/bundles/mediabunny.cjs"></script>

 <script type="module">
 	const fileInput = document.createElement('input');
@@ -1,6 +1,6 @@
 <button>Go</button>

-<script src="../dist/mediabunny.js"></script>
+<script src="../dist/bundles/mediabunny.cjs"></script>

 <script type="module">
    function download(blob, filename) {
@@ -1,6 +1,6 @@
 <!DOCTYPE html>

-<script src="../dist/mediabunny.js"></script>
+<script src="../dist/bundles/mediabunny.cjs"></script>

 <script type="module">
 	function download(blob, filename) {
@@ -15,7 +15,7 @@
 	</div>
 </div>

-<script src="../dist/mediabunny.js"></script>
+<script src="../dist/bundles/mediabunny.cjs"></script>

 <script type="module">
 const fileInput = document.querySelector('input[type="file"]');
@@ -75,6 +75,7 @@ export default withMermaid({
 			{ icon: 'github', link: 'https://github.com/Vanilagy/mediabunny' },
 			{ icon: 'discord', link: 'https://discord.gg/hmpkyYuS4U' },
 			{ icon: 'x', link: 'https://x.com/vanilagy' },
+			{ icon: 'bluesky', link: 'https://bsky.app/profile/vanilagy.bsky.social' },
 		],

 		search: {
@@ -27,7 +27,9 @@ ESM is preferred because it gives you tree shaking.

 You can also just include the library using a script tag in your HTML:
 ```html
-<script src="path/to/mediabunny.js"></script>
+<script src="mediabunny.cjs"></script>
 ```

-You can download the built distribution file from the [releases page](https://github.com/Vanilagy/mediabunny/releases).
+This will add a `Mediabunny` object to the global scope.
+
+You can download a built distribution file from the [releases page](https://github.com/Vanilagy/mediabunny/releases). Use the `*.cjs` builds for normal script tag inclusion, or the `*.mjs` builds for script tags with `type="module"` or direct imports via ESM. Including the `mediabunny.d.ts` declaration file in your TypeScript project will declare a global `Mediabunny` namespace.
@@ -237,7 +237,7 @@ await conversion.execute();
 </div>
 </div>

-<div class="flex flex-col-reverse lg:flex-row gap-4 lg:gap-20 lg:items-center">
+<div class="flex flex-col-reverse lg:flex-row gap-4 lg:gap-20 items-center">
 <div class="relative flex-1 min-w-0">
 <div class="absolute size-70 rounded-full bg-[#ff45ac]/0 top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 blur-[200px]" />
 <img class="relative" src="./assets/inspiring-io.svg">
@@ -253,7 +253,7 @@ const runAudioIterator = async () => {
 	}

 	// To play back audio, we loop over all audio chunks (typically very short) of the file and play them at the correct
-	// timestamp. The result is a continuous, uninteruppted audio signal.
+	// timestamp. The result is a continuous, uninterrupted audio signal.
 	for await (const { buffer, timestamp } of audioBufferIterator!) {
 		const node = audioContext!.createBufferSource();
 		node.buffer = buffer;
@@ -1,12 +1,12 @@
 {
  "name": "mediabunny",
-  "version": "1.0.1",
+  "version": "1.0.5",
  "lockfileVersion": 3,
  "requires": true,
  "packages": {
    "": {
      "name": "mediabunny",
-      "version": "1.0.1",
+      "version": "1.0.5",
      "license": "MPL-2.0",
      "dependencies": {
        "@types/dom-mediacapture-transform": "^0.1.11",
@@ -319,9 +319,9 @@
      }
    },
    "node_modules/@babel/helper-string-parser": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/helper-string-parser/-/helper-string-parser-7.25.9.tgz",
-      "integrity": "sha512-4A/SCr/2KLd5jrtOMFzaKjVtAei3+2r/NChoBNoZ3EyP/+GlhoaEGoWOZUmFmoITP7zOJyHIMm+DYRd8o3PvHA==",
+      "version": "7.27.1",
+      "resolved": "https://registry.npmjs.org/@babel/helper-string-parser/-/helper-string-parser-7.27.1.tgz",
+      "integrity": "sha512-qMlSxKbpRlAridDExk92nSobyDdpPijUq2DW6oDnUqd0iOGxmQjyqhMIihI9+zv4LPyZdRje2cavWPbCbWm3eA==",
      "dev": true,
      "license": "MIT",
      "engines": {
@@ -329,9 +329,9 @@
      }
    },
    "node_modules/@babel/helper-validator-identifier": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.25.9.tgz",
-      "integrity": "sha512-Ed61U6XJc3CVRfkERJWDz4dJwKe7iLmmJsbOGu9wSloNSFttHV0I8g6UAgb7qnK5ly5bGLPd4oXZlxCdANBOWQ==",
+      "version": "7.27.1",
+      "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.27.1.tgz",
+      "integrity": "sha512-D2hP9eA+Sqx1kBZgzxZh0y1trbuU+JoDkiEwqhQ36nodYqJwyEIhPSdMNd7lOm/4io72luTPWH20Yda0xOuUow==",
      "dev": true,
      "license": "MIT",
      "engines": {
@@ -339,13 +339,13 @@
      }
    },
    "node_modules/@babel/parser": {
-      "version": "7.27.0",
-      "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.27.0.tgz",
-      "integrity": "sha512-iaepho73/2Pz7w2eMS0Q5f83+0RKI7i4xmiYeBmDzfRVbQtTOG7Ts0S4HzJVsTMGI9keU8rNfuZr8DKfSt7Yyg==",
+      "version": "7.28.0",
+      "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.28.0.tgz",
+      "integrity": "sha512-jVZGvOxOuNSsuQuLRTh13nU0AogFlw32w/MT+LV6D3sP5WdbW61E77RnkbaO2dUvmPAYrBDJXGn5gGS6tH4j8g==",
      "dev": true,
      "license": "MIT",
      "dependencies": {
-        "@babel/types": "^7.27.0"
+        "@babel/types": "^7.28.0"
      },
      "bin": {
        "parser": "bin/babel-parser.js"
@@ -355,14 +355,14 @@
      }
    },
    "node_modules/@babel/types": {
-      "version": "7.27.0",
-      "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.27.0.tgz",
-      "integrity": "sha512-H45s8fVLYjbhFH62dIJ3WtmJ6RSPt/3DRO0ZcT2SUiYiQyz3BLVb9ADEnLl91m74aQPS3AzzeajZHYOalWe3bg==",
+      "version": "7.28.0",
+      "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.28.0.tgz",
+      "integrity": "sha512-jYnje+JyZG5YThjHiF28oT4SIZLnYOcSBb6+SDaFIyzDVSkXQmQQYclJ2R+YxcdmK0AX6x1E5OQNtuh3jHDrUg==",
      "dev": true,
      "license": "MIT",
      "dependencies": {
-        "@babel/helper-string-parser": "^7.25.9",
-        "@babel/helper-validator-identifier": "^7.25.9"
+        "@babel/helper-string-parser": "^7.27.1",
+        "@babel/helper-validator-identifier": "^7.27.1"
      },
      "engines": {
        "node": ">=6.9.0"
@@ -1238,18 +1238,14 @@
      }
    },
    "node_modules/@jridgewell/gen-mapping": {
-      "version": "0.3.8",
-      "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.8.tgz",
-      "integrity": "sha512-imAbBGkb+ebQyxKgzv5Hu2nmROxoDOXHh80evxdoXNOrvAnVx7zimzc1Oo5h9RlfV4vPXaE2iM5pOFbvOCClWA==",
+      "version": "0.3.12",
+      "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.12.tgz",
+      "integrity": "sha512-OuLGC46TjB5BbN1dH8JULVVZY4WTdkF7tV9Ys6wLL1rubZnCMstOhNHueU5bLCrnRuDhKPDM4g6sw4Bel5Gzqg==",
      "dev": true,
      "license": "MIT",
      "dependencies": {
-        "@jridgewell/set-array": "^1.2.1",
-        "@jridgewell/sourcemap-codec": "^1.4.10",
+        "@jridgewell/sourcemap-codec": "^1.5.0",
        "@jridgewell/trace-mapping": "^0.3.24"
-      },
-      "engines": {
-        "node": ">=6.0.0"
      }
    },
    "node_modules/@jridgewell/resolve-uri": {
@@ -1262,16 +1258,6 @@
        "node": ">=6.0.0"
      }
    },
-    "node_modules/@jridgewell/set-array": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/@jridgewell/set-array/-/set-array-1.2.1.tgz",
-      "integrity": "sha512-R8gLRTZeyp03ymzP/6Lil/28tGeGEzhx1q2k703KGWRAI1VdvPIXdG70VJc2pAMw3NA6JKL5hhFu1sJX0Mnn/A==",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=6.0.0"
-      }
-    },
    "node_modules/@jridgewell/sourcemap-codec": {
      "version": "1.5.0",
      "resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.5.0.tgz",
@@ -1280,9 +1266,9 @@
      "license": "MIT"
    },
    "node_modules/@jridgewell/trace-mapping": {
-      "version": "0.3.25",
-      "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.25.tgz",
-      "integrity": "sha512-vNk6aEwybGtawWmy/PzwnGDOjCkLWSD2wqvjGGAgOAwCGWySYXfYoxt00IJkTF+8Lb57DwOb3Aa0o9CApepiYQ==",
+      "version": "0.3.29",
+      "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.29.tgz",
+      "integrity": "sha512-uw6guiW/gcAGPDhLmd77/6lW8QLeiV5RUTsAX46Db6oLhGaVj4lhnPwb184s1bkc8kdVg/+h988dro8GRDpmYQ==",
      "dev": true,
      "license": "MIT",
      "dependencies": {
@@ -1,25 +1,27 @@
 {
  "name": "mediabunny",
  "author": "Vanilagy",
-  "version": "1.0.1",
+  "version": "1.0.5",
  "description": "Pure TypeScript media toolkit for reading, writing, and converting media files, directly in the browser.",
  "type": "module",
-  "main": "./dist/mediabunny.js",
-  "module": "./dist/mediabunny.mjs",
-  "types": "./dist/mediabunny.d.ts",
+  "main": "./dist/bundles/mediabunny.cjs",
+  "module": "./dist/modules/index.js",
+  "types": "./dist/modules/index.d.ts",
  "exports": {
-    "types": "./dist/mediabunny.d.ts",
-    "import": "./dist/mediabunny.mjs",
-    "require": "./dist/mediabunny.js"
+    "types": "./dist/modules/index.d.ts",
+    "import": "./dist/modules/index.js",
+    "require": "./dist/bundles/mediabunny.cjs"
  },
  "files": [
    "README.md",
    "package.json",
    "LICENSE",
-    "dist"
+    "dist",
+    "src"
  ],
+  "sideEffects": false,
  "scripts": {
-    "build": "tsx scripts/ensure-license-headers.ts && node build.mjs && tsc -p src && api-extractor run && npm run check-docblocks && tsx scripts/append-namespace.ts",
+    "build": "rm -rf dist && tsx scripts/ensure-license-headers.ts && tsc -p src && npm run fix-build-import-paths && node build.mjs && api-extractor run && npm run check-docblocks && npm run append-namespace",
    "watch": "node build.mjs --watch",
    "lint": "eslint .",
    "check": "tsc -p src --noEmit && tsc -p scripts --noEmit && tsc -p tsconfig.vite.json --noEmit && rm tsconfig.vite.tsbuildinfo",
@@ -28,7 +30,9 @@
    "docs:build": "vitepress build docs && npm run examples:build",
    "docs:preview": "vitepress preview docs",
    "dev": "vite",
-    "examples:build": "vite build"
+    "examples:build": "vite build",
+    "fix-build-import-paths": "find dist -name \"*.js\" -type f -exec sed -i -r \"s/ from '([^']+)';/ from '\\1.js';/g\" {} \\;",
+    "append-namespace": "echo 'export as namespace Mediabunny;' >> dist/mediabunny.d.ts"
  },
  "license": "MPL-2.0",
  "repository": {
@@ -1,3 +0,0 @@
-import { appendFileSync } from 'fs';
-
-appendFileSync('dist/mediabunny.d.ts', '\nexport as namespace Mediabunny;');
@@ -6,6 +6,9 @@
 * file, You can obtain one at https://mozilla.org/MPL/2.0/.
 */

+/// <reference types="dom-mediacapture-transform" preserve="true" />
+/// <reference types="dom-webcodecs" preserve="true" />
+
 export {
 	Output,
 	OutputOptions,
@@ -701,7 +701,11 @@ export class IsobmffDemuxer extends Demuxer {
 					}

 					if (relevantEntryFound) {
-						throw new Error('Unsupported edit list: multiple edits are not supported.');
+						console.warn(
+							'Unsupported edit list: multiple edits are not currently supported. Only using first edit.',
+						);
+
+						break;
 					}

 					if (mediaTime === -1) {
@@ -416,8 +416,9 @@ class VideoEncoderWrapper {
 				const support = await VideoEncoder.isConfigSupported(encoderConfig);
 				if (!support.supported) {
 					throw new Error(
-						'This specific encoder configuration is not supported by this browser. Consider using another'
-						+ ' codec or changing your video parameters.',
+						`This specific encoder configuration (${encoderConfig.codec}, ${encoderConfig.bitrate} bps,`
+						+ ` ${encoderConfig.width}x${encoderConfig.height}) is not supported by this browser. Consider`
+						+ ` using another codec or changing your video parameters.`,
 					);
 				}

@@ -988,8 +989,9 @@ class AudioEncoderWrapper {
 				const support = await AudioEncoder.isConfigSupported(encoderConfig);
 				if (!support.supported) {
 					throw new Error(
-						'This specific encoder configuration not supported by this browser. Consider using another'
-						+ ' codec or changing your audio parameters.',
+						`This specific encoder configuration (${encoderConfig.codec}, ${encoderConfig.bitrate} bps,`
+						+ ` ${encoderConfig.numberOfChannels} channels, ${encoderConfig.sampleRate} Hz) is not`
+						+ ` supported by this browser. Consider using another codec or changing your audio parameters.`,
 					);
 				}

@@ -1,9 +1,8 @@
 {
 	"extends": "../tsconfig.json",
 	"compilerOptions": {
-		"outDir": "../build",
+		"outDir": "../dist/modules",
 		"declaration": true,
-		"sourceMap": true,
 		"declarationMap": true,
 		"stripInternal": true,
 		"noEmit": false
@@ -20,7 +20,7 @@ const rollupInput = Object.fromEntries(
 export default defineConfig({
 	resolve: {
 		alias: {
-			mediabunny: path.resolve(__dirname, './dist/mediabunny.mjs'),
+			mediabunny: path.resolve(__dirname, './dist/bundles/mediabunny.mjs'),
 		},
 	},
 	plugins: [
Author	SHA1	Message	Date
Vanilagy	fba463f46b	Be more graceful with unsupported edit lists	2025-07-10 17:33:10 +02:00
Vanilagy	3621c59034	Center bunny, add bisky	2025-07-10 11:39:02 +02:00
Vanilagy	a16911874c	Clarify built distribution files in docs	2025-07-09 12:14:29 +02:00
Vanilagy	f59a79dcf7	Bump permissions for Release workflow	2025-07-09 12:05:33 +02:00
Vanilagy	19b7036d82	Bump version to 1.0.4	2025-07-09 11:59:32 +02:00
Vanilagy	47bae059db	Add build artifact upload step to Release workflow	2025-07-09 11:58:15 +02:00
Vanilagy	84c9d37cb7	Revise build step and dist structure for better Webpack, CJS and pnpm support	2025-07-09 11:53:19 +02:00
David P.andGitHub	3e96184a6f	Merge pull request #11 from studnitz/patch-1 Fix typo	2025-07-09 10:29:23 +02:00
Alexander von StudnitzandGitHub	ee59837857	Fix typo	2025-07-09 09:47:26 +02:00
Vanilagy	08cf34ee0d	Adjust README image sizes	2025-07-08 15:42:32 +02:00
Vanilagy	1b382d3e57	Improve unsupported encoder configuration error messages	2025-07-07 11:21:42 +02:00