W3cubDocs

/Web APIs

Media Capabilities API

The Media Capabilities API allows developers to determine decoding and encoding abilities of the device, exposing information such as whether media is supported and whether playback should be smooth and power efficient, with real time feedback about playback to better enable adaptive streaming, and access to display property information.

Examples

Detect audio file support and expected performance

This example defines an audio configuration then checks to see if the user agent supports decoding that media configuration, and whether it will perform well in terms of smoothness and power efficiency.

js

if ("mediaCapabilities" in navigator) {
  const audioFileConfiguration = {
    type: "file",
    audio: {
      contentType: "audio/mp3",
      channels: 2,
      bitrate: 132700,
      samplerate: 5200,
    },
  };

  navigator.mediaCapabilities
    .decodingInfo(audioFileConfiguration)
    .then((result) => {
      console.log(
        `This configuration is ${result.supported ? "" : "not "}supported,`,
      );
      console.log(`${result.smooth ? "" : "not "}smooth, and`);
      console.log(`${result.powerEfficient ? "" : "not "}power efficient.`);
    })
    .catch(() => {
      console.log(`decodingInfo error: ${contentType}`);
    });
}

Media Capabilities API concepts and usage

There are a myriad of video and audio codecs. Different browsers support different media types and new media types are always being developed. With the Media Capabilities API, developers can ensure each user is getting the best bitrate and storage savings for their browser, device, and OS capabilities.

Whether a device uses hardware or software decoding impacts how smooth and power efficient the video decoding is and how efficient the playback will be. The Media Capabilities API enables determining which codecs are supported and how performant a media file will be both in terms of smoothness and power efficiency.

The Media Capabilities API provide more powerful features than say MediaRecorder.isTypeSupported() or HTMLMediaElement.canPlayType(), which only address general browser support, not performance. The API also provides abilities to access display property information such as supported color gamut, dynamic range abilities, and real-time feedback about the playback.

To test support, smoothness, and power efficiency of a video or audio file, you use the MediaCapabilities interface's encodingInfo() and decodingInfo() methods.

Media capabilities information enables websites to enable adaptive streaming to alter the quality of content based on actual user-perceived quality, and react to a pick of CPU/GPU usage in real time.

Media Capabilities Interfaces

MediaCapabilities

Provides information about the decoding abilities of the device, system and browser based on codecs, profile, resolution, and bitrates. The information can be used to serve optimal media streams to the user and determine if playback should be smooth and power efficient .

ScreenColorGamut

Will describe the color gamut, or the range of color, the screen can display (not currently supported anywhere).

ScreenLuminance

Will describe the known luminance characteristics of the screen (not currently supported anywhere).

Specifications

Browser compatibility

Desktop Mobile
Chrome Edge Firefox Internet Explorer Opera Safari WebView Android Chrome Android Firefox for Android Opera Android Safari on IOS Samsung Internet
Media_Capabilities_API 66 79 63 No 53 13 66 66 63 48 13 9.0
decodingInfo
66["codecs string can contain any subset of optional parameters (should be all or none).", "Errors if codecs string contains unexpected characters (should evaluate string up to character)."]
79["codecs string can contain any subset of optional parameters (should be all or none).", "Errors if codecs string contains unexpected characters (should evaluate string up to character)."]
63["The webrtc value of the type option is named transmission.", "Before Firefox 101, decodingInfo() ignored codecs parameter options for av01 codecs (treating them as av1)."]
No
53["codecs string can contain any subset of optional parameters (should be all or none).", "Errors if codecs string contains unexpected characters (should evaluate string up to character)."]
13
66["codecs string can contain any subset of optional parameters (should be all or none).", "Errors if codecs string contains unexpected characters (should evaluate string up to character)."]
66["codecs string can contain any subset of optional parameters (should be all or none).", "Errors if codecs string contains unexpected characters (should evaluate string up to character)."]
63["The webrtc value of the type option is named transmission.", "Before Firefox 101, decodingInfo() ignored codecs parameter options for av01 codecs (treating them as av1)."]
48["codecs string can contain any subset of optional parameters (should be all or none).", "Errors if codecs string contains unexpected characters (should evaluate string up to character)."]
13
9.0["codecs string can contain any subset of optional parameters (should be all or none).", "Errors if codecs string contains unexpected characters (should evaluate string up to character)."]
encodingInfo 101 101
63The webrtc value of the type option is named transmission.
No 87 15.4 101 101
63The webrtc value of the type option is named transmission.
70 15.4 19.0

See also

© 2005–2023 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/Media_Capabilities_API