From bc201ca265a87e8bef5836f1ebf2921e6154ff76 Mon Sep 17 00:00:00 2001 From: Vanilagy <1696106+Vanilagy@users.noreply.github.com> Date: Thu, 26 Jun 2025 22:00:35 +0200 Subject: [PATCH] Home page mobile support --- docs/guide/introduction.md | 1 + docs/guide/quick-start.md | 2 +- docs/index.md | 45 +++++++++++++++++++------------------- 3 files changed, 24 insertions(+), 24 deletions(-) diff --git a/docs/guide/introduction.md b/docs/guide/introduction.md index 852ee05..930600e 100644 --- a/docs/guide/introduction.md +++ b/docs/guide/introduction.md @@ -39,6 +39,7 @@ Mediabunny is a general-purpose toolkit and can be used in infinitely many ways. - Creating videos in the browser - Building a video editor - Live recording & streaming +- Efficient, sample-accurate playback of large files via the Web Audio API Check out the [Examples](/examples) page for demo implementations of many of these ideas! diff --git a/docs/guide/quick-start.md b/docs/guide/quick-start.md index 246dc40..05bd247 100644 --- a/docs/guide/quick-start.md +++ b/docs/guide/quick-start.md @@ -210,7 +210,7 @@ if (videoTrack) { Check out [`EncodedPacketSink`](./media-sinks#encodedpacketsink) for the full documentation. ::: -## Write new media files +## Create new media files ```ts import { diff --git a/docs/index.md b/docs/index.md index 745753e..620547f 100644 --- a/docs/index.md +++ b/docs/index.md @@ -1,5 +1,4 @@ --- -# https://vitepress.dev/reference/default-theme-home-page layout: home title: Mediabunny @@ -21,8 +20,8 @@ hero: ---
-
-
+
+

Read any media file, efficiently

Mediabunny allows you efficiently read data from any media file, no matter the size: duration, resolution, rotation, tracks, codecs and other metadata, as well as raw or decoded media data from anywhere in the file. Load only what you need.

@@ -30,7 +29,7 @@ hero:
-
+
@@ -61,8 +60,8 @@ for await (const frame of sink.samples()) {
-
-
+
+
@@ -95,7 +94,7 @@ const { buffer } = output.target; // Contains the final file ```
-
+

Create new media files, programmatically

Generate new media files (such as MP4 or WebM) directly on the client, and as fast as the hardware allows. Add multiple video, audio, or subtitle tracks, and have precise control down to the microsecond.

@@ -105,8 +104,8 @@ const { buffer } = output.target; // Contains the final file
-
-
+
+

Hopping-fast file conversion

Use the Conversion API to transform any media file into any other media file: perform transmuxing, transcoding, resizing, rotation, audio resampling, trimming, and more.

 @@ -114,7 +113,7 @@ const { buffer } = output.target; // Contains the final file
-
+
@@ -137,19 +136,19 @@ await conversion.execute();
-
-
+
+
-
+

Universal I/O

Read and write files from and to memory, disk, or the network. Create files for offline use, or live-stream them as they're being created. Inject media data from a canvas, webcam, screen, microphone, audio buffer, your own encoding stack, or whatever. It's all up to you.

-
-
+
+

Wide container & codec support

Mediabunny supports many commonly used container formats and a wide variety of video and audio codecs. And all of them bidirectionally, too! (that means for reading and writing)

@@ -157,7 +156,7 @@ await conversion.execute();
-
+
@@ -205,14 +204,13 @@ const bundleSizes = [ { name: 'Writing .mp4 files', size: 17.28 }, { name: 'Reading all formats', size: 30.02 }, { name: 'mp4box.js', size: 37.3, isThirdParty: true }, - { name: 'web-demuxer', size: 44.8, isThirdParty: true }, { name: 'All features', size: 69.62 }, { name: '@remotion/webcodecs', size: 87.2 + 20.8, isThirdParty: true }, ]; -
-
+
+

{{ benchmark.name }}

@@ -223,18 +221,18 @@ const bundleSizes = [

Reading BigBuckBunny1080pH264.mov (691 MiB) from disk
Ryzen 7600X, RTX 4070, NVMe SSD, measured 2025-06-22

-
+

High performance

By reading only what you need, writing progressively, utilizing hardware-accelerated encoding and decoding via the WebCodecs API, and using a pipelined design, Mediabunny is able to get the job done fast.

-
-
+
+

Built from scratch, for the web

Mediabunny is 100% implemented in TypeScript and has zero dependencies. Its API was designed to be highly tree-shakable, meaning you only include what you use.

-
+

Bundle size, minified + gzipped

{{ result.name }}

@@ -247,6 +245,7 @@ const bundleSizes = [
+

Measured 2025-06-22