Skip to main content

Check if a video can be decoded using Mediabunny

Before attempting to load a video into <Video>, you may want to check if the video can be decoded by the browser. This can be done using Mediabunny.

Here's a canDecode() function you can copy and paste into your project:

can-decode.ts
ts
import {ALL_FORMATS, Input, UrlSource} from 'mediabunny';
 
export const canDecode = async (src: string) => {
  const input = new Input({
    formats: ALL_FORMATS,
    source: new UrlSource(src),
  });
 
  try {
    await input.getFormat();
  } catch {
    return false;
  }
 
  const videoTrack = await input.getPrimaryVideoTrack();
  if (videoTrack && !(await videoTrack.canDecode())) {
    return false;
  }
 
  const audioTrack = await input.getPrimaryAudioTrack();
  if (audioTrack && !(await audioTrack.canDecode())) {
    return false;
  }
 
  return true;
};

Usage​

Check if a video can be decoded​

ts
const src = 'https://remotion.media/video.mp4';
const isDecodable = await canDecode(src);
if (isDecodable) {
  console.log('Video can be decoded');
} else {
  console.log('Video cannot be decoded');
}

See also​