ContextQMD
Back to Remotion

Parsing on Web Workers

packages/docs/docs/media-parser/workers.mdx

4.0.4692.5 KB
Original Source

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

Parsing using parseMedia() will block the main thread of JavaScript, which is undesirable if you are displaying a UI in the browser, or are serving requests on a web server.

You can run the parse on a Worker instead of on the main thread using parseMediaOnWebWorker().

The API takes care of exchanging messages between the main thread and the Web Worker, so that parseMediaOnWebWorker() can be used as a drop-in replacement for parseMedia().

Example

tsx
import {parseMediaOnWebWorker} from '@remotion/media-parser/worker';

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

console.log(result.durationInSeconds); // 10
console.log(result.dimensions); // {width: 1920, height: 1080}

Parsing on the server using a worker

Bun also implements the Worker object.
To use it, you can use the parseMediaOnServerWorker() API.

tsx
import {parseMediaOnServerWorker} from '@remotion/media-parser/server-worker';

const result = await parseMediaOnServerWorker({
  src: '/tmp/video.mp4',
  fields: {
    durationInSeconds: true,
    dimensions: true,
  },
});

console.log(result.durationInSeconds); // 10
console.log(result.dimensions); // {width: 1920, height: 1080}

The difference to parseMediaOnWebWorker() is that it also supports from reading local file paths.

API Differences

The parseMediaOnWebWorker and parseMediaOnServerWorker() APIs don't accept the reader field.

It is hardcoded to webReader and universalReader respectively.

See also