bilibili

web-demuxer

Frontend#WebAssembly#WebCodecs#Multimedia#TypeScript#FFmpeg

185

// summary

Web-Demuxer is a browser-based library that utilizes WebAssembly to provide comprehensive demuxing capabilities for various multimedia formats. It is specifically designed to integrate seamlessly with the WebCodecs API by providing necessary decoder configurations and encoded chunks. The library supports a wide range of file types and allows developers to build custom versions for specific format requirements.

// technical analysis

Web-Demuxer is a browser-based multimedia processing library that leverages WebAssembly to provide robust demuxing capabilities for the WebCodecs API. It addresses the limitation where WebCodecs lacks native demuxing, offering a unified interface to handle a wide array of formats like MP4, MKV, FLV, and more. By utilizing a WebCodecs-first design, the project simplifies the extraction of decoder configurations and encoded chunks, making it a critical tool for developers building high-performance media applications in the browser.

// key highlights

Provides a WebCodecs-first API that seamlessly integrates with browser-native decoding pipelines.

Supports a broad range of multimedia formats including mov, mp4, mkv, webm, flv, and more in a single package.

Offers detailed media metadata extraction functionality similar to the industry-standard ffprobe tool.

Enables customizable WASM builds, allowing developers to reduce bundle size by including only the necessary format support.

Supports both random access via seek operations and sequential data access through ReadableStreams for flexible media handling.

// use cases

Seamless integration with WebCodecs for browser-based video and audio decoding

Extraction of detailed media metadata similar to ffprobe output

Customizable WASM builds to support specific multimedia container formats

// getting started

To begin, install the package via npm and ensure the required WASM file is served from your static directory. Initialize the WebDemuxer instance, call the load method with your media source, and use getDecoderConfig or seek to retrieve data for the WebCodecs VideoDecoder or AudioDecoder.