Skip to content

Client-side export via WebCodecs + Mediabunny #2

Description

@ronak-create

What

Move the fast-export encode into the browser using WebCodecs for encoding and Mediabunny for muxing.

Suggested by Mediabunny's author (vanilagy) in the Show HN thread.

Why

The current fast-export path renders each frame on canvas, encodes it as JPEG, POSTs it to the server, and ffmpeg encodes the MP4. That means:

  • a lossy JPEG intermediate for every frame
  • an HTTP round trip per frame
  • ffmpeg on PATH is required for high-quality export (biggest setup friction we have)

With WebCodecs + Mediabunny the canvas frames go straight into a (usually hardware) encoder and get muxed to MP4 client-side. No JPEG hop, no server round trips, no ffmpeg requirement for export. It also unblocks #hosted-demo-mode, since export would work on a static host.

Tradeoffs to settle

  • This would be the first dependency in a zero-dependency repo. Proposal: vendor Mediabunny as a single file under vendor/ so node server.js stays the only install step.
  • Keep the ffmpeg path as a fallback (it still handles upload remuxing and the analyze pipeline regardless).
  • Audio: the offline WAV mix needs an AudioEncoder pass (AAC or Opus) instead of ffmpeg's encode.

Done when

Export produces an MP4 of comparable quality to the current CRF-18 path with ffmpeg absent from PATH, in Chromium.

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or request

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions