import Tabs from '@theme/Tabs'; import TabItem from '@theme/TabItem'; import {TableOfContents, MediaParserGuideTableOfContents, ReadersTableOfContents, WritersTableOfContents, TypesTableOfContents} from './TableOfContents';

@remotion/media-parser

:::warning We are phasing out Media Parser and are moving to Mediabunny! :::

This is a package that parses video and audio files to extract metadata and samples.

Design goals:

• Support all major containers: .mp4, .mov, .webm, .mkv, .avi, .m3u8, .ts, .mp3, .wav, .aac, .m4a and .flac.
• Easily get various information from multimedia files
• Work in the browser, Node.js and Bun
• Satisfy your query with minimal fetching
• Functional TypeScript API
• Be useful when passing unsupported media
• Allow decoding video frames and audio samples using WebCodecs
• Pausable, resumable and cancellable
• Be able to seek to a different position in a media file
• No dependencies

Introduction video

Installation

Hello World

Get metadata from a video file - over 20 different fields are supported.

import {parseMedia} from '@remotion/media-parser';

const {durationInSeconds, videoCodec} = await parseMedia({
  src: 'https://remotion.media/video.mp4',
  fields: {
    durationInSeconds: true,
    videoCodec: true,
  },
});

console.log(durationInSeconds); // 5.056;
console.log(videoCodec); // 'h264';

Extract samples from a video file - supports WebCodecs.

import {parseMedia} from '@remotion/media-parser';

await parseMedia({
  src: 'https://remotion.media/video.mp4',
  onVideoTrack: ({track}) => {
    // Get information about the
    console.log(track.width);
    console.log(track.height);
    return (sample) => {
      // Retrieve samples as they are extracted
      console.log(sample.timestamp); // 0
      console.log(sample.data); // Uint8Array(12345)
    };
  },
});

Samples contain audio or video data - but they are compressed using codecs like AAC for audio or H.264 for video.
You can turn audio samples into a waveform and video samples into images by decoding them.

Guide

APIs

The following APIs are available:

Readers

Choose the appropriate reader for your file source:

Writers

Choose how to store files downloaded using downloadAndParseMedia():

Types

How does this compare to FFmpeg?

• Media Parser specializes for JavaScript and on the web.
  It is designed to embrace the language and make use of the APIs that JavaScript has to offer.
• Unlike FFmpeg, Remotion Media Parser does not have functionality for decoding and encoding – it only parses media files.
  Instead, we hope you combine it with WebCodecs, the native API built into browsers.
• Media Parser has no command line interface and cannot be integrated into native applications.

How does this compare to MP4Box.js?

MP4Box.js does a better job at parsing the ISO Base Media Format (.mp4, .m4a, .mov) and supports reading more information from it.
Remotion Media Parser supports more container formats, with the goal that it can handle arbitrary user-provided media files.

Thank you

</td>
<td>
  <a href="https://tella.com">Tella</a> for boosting the development of @remotion/media-parser with $10.000!
</td>

License

Remotion License