Media Capabilities

Where canPlayType() answers only "maybe" or "probably", navigator.mediaCapabilities.decodingInfo() reports whether an exact configuration is supported, smooth and powerEfficient (usually hardware-decoded), so a player can pick the rendition that saves battery. encodingInfo() does the same for recording and WebRTC.

Asking which 1080p codec decodes efficiently on this deviceJavaScript

const codecs = { 'H.264': 'avc1.640028', VP9: 'vp09.00.40.08', AV1: 'av01.0.08M.08' };
for (const [name, codec] of Object.entries(codecs)) {
  const { supported, smooth, powerEfficient } = await navigator.mediaCapabilities.decodingInfo({
    type: 'media-source',                                    // or 'file', 'webrtc'
    video: { contentType: `video/mp4; codecs="${codec}"`, width: 1920, height: 1080,
      bitrate: 5_000_000, framerate: 30 },
  });
  console.log(name.padEnd(5), JSON.stringify({ supported, smooth, powerEfficient }));
}

Output

H.264 {"supported":true,"smooth":true,"powerEfficient":true}
VP9   {"supported":true,"smooth":true,"powerEfficient":true}
AV1   {"supported":true,"smooth":true,"powerEfficient":false}

This laptop lacks an AV1 hardware decoder, so VP9 or H.264 is the better choice here despite AV1's smaller files.

MENU

Media Capabilities