Skip to main content

defaultOnVideoTrackHandler()

This is the default function if no onVideoTrack handler is provided to convertMedia().
You may use this function if you want to customize part of the track transformation logic, but fall back to the default behavior for the rest.

Falling back to the default behavior
tsx
import {convertMedia, defaultOnAudioTrackHandler} from '@remotion/webcodecs';
 
await convertMedia({
  src: 'https://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4',
  container: 'webm',
  onAudioTrack: (params) => {
    // Custom logic for handling video tracks
    // ...
 
    // Fall back to the default behavior
    return defaultOnAudioTrackHandler(params);
  },
});
Falling back to the default behavior
tsx
import {convertMedia, defaultOnAudioTrackHandler} from '@remotion/webcodecs';
 
await convertMedia({
  src: 'https://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4',
  container: 'webm',
  onAudioTrack: (params) => {
    // Custom logic for handling video tracks
    // ...
 
    // Fall back to the default behavior
    return defaultOnAudioTrackHandler(params);
  },
});

Algorithm​

The default behavior is as follows:

  • Check if the track can be copied without re-encoding, if true, then do that.
  • Determine the video codec to be used - either videoCodec which was passed to convertMedia() or the default codec for the container.
  • Check if the track can be re-encoded with the chosen video codec, if true, then do that.
  • If the track can be neither copied nor re-encoded, then fail the render.
    You may alternatively return {type: 'drop'} to remove the video track, but still succeed the other tracks.
Source code for defaultOnVideoTrackHandler
tsx
import {
  canReencodeVideoTrack,
  getDefaultVideoCodec,
  ConvertMediaOnVideoTrackHandler,
  VideoOperation,
  canCopyVideoTrack,
} from '@remotion/webcodecs';
 
export const defaultOnVideoTrackHandler: ConvertMediaOnVideoTrackHandler =
  async ({
    track,
    defaultVideoCodec,
    logLevel,
    container,
  }): Promise<VideoOperation> => {
    const canCopy = canCopyVideoTrack({
      inputCodec: track.codecWithoutConfig,
      container,
    });
 
    if (canCopy) {
      return Promise.resolve({type: 'copy'});
    }
 
    const videoCodec = defaultVideoCodec ?? getDefaultVideoCodec({container});
 
    if (videoCodec === null) {
      return Promise.resolve({type: 'drop'});
    }
 
    const canReencode = await canReencodeVideoTrack({
      videoCodec,
      track,
    });
 
    if (canReencode) {
      return Promise.resolve({type: 'reencode', videoCodec});
    }
 
    return Promise.resolve({type: 'fail'});
  };
Source code for defaultOnVideoTrackHandler
tsx
import {
  canReencodeVideoTrack,
  getDefaultVideoCodec,
  ConvertMediaOnVideoTrackHandler,
  VideoOperation,
  canCopyVideoTrack,
} from '@remotion/webcodecs';
 
export const defaultOnVideoTrackHandler: ConvertMediaOnVideoTrackHandler =
  async ({
    track,
    defaultVideoCodec,
    logLevel,
    container,
  }): Promise<VideoOperation> => {
    const canCopy = canCopyVideoTrack({
      inputCodec: track.codecWithoutConfig,
      container,
    });
 
    if (canCopy) {
      return Promise.resolve({type: 'copy'});
    }
 
    const videoCodec = defaultVideoCodec ?? getDefaultVideoCodec({container});
 
    if (videoCodec === null) {
      return Promise.resolve({type: 'drop'});
    }
 
    const canReencode = await canReencodeVideoTrack({
      videoCodec,
      track,
    });
 
    if (canReencode) {
      return Promise.resolve({type: 'reencode', videoCodec});
    }
 
    return Promise.resolve({type: 'fail'});
  };

See also​