AV1 support ^BETA

Documentation sections

• Scope of support
• Player code example

Scope of support

AOMedia Video 1 (AV1) is an open, royalty-free video coding format designed for video transmissions over the Internet. It is being developed by the Alliance for Open Media (AOMedia), a consortium of firms from the semiconductor industry, video on demand providers, and web browser developers, founded in 2015. The AV1 bitstream specification includes a reference video codec. It succeeds VP9. It can have 20% higher data compression than VP9 or HEVC/H.265 from the Moving Picture Experts Group and about 50% higher than the widely used AVC.

As of February 2019, AV1 video support is available in latest Chrome, Firefox and Opera. This table can give more complete and up to date information.

AV1 video support in Radiant Media Player is currently only available in progressive download mode in MP4 container. We plan to add support for HLS and DASH at a later stage.

A guide for encoding video with AV1 codec can be found here.

Player code example - see this example here

In order to determine AV1 video support we will use the canPlayType player method as described here.

<script src="https://cdn.radiantmediatechs.com/rmp/5.6.1/js/rmp.min.js"></script>
<div id="rmpPlayer"></div>
<script>
  // First we create our Radiant Media Player instance
  var elementID = 'rmpPlayer';
  var rmp = new RadiantMP(elementID);
  // We can then gain access to the getEnvironment API method
  var env = rmp.getEnvironment();
  // We define 2 source objects, one with AV1/AAC and the other with H.264/AAC
  var src;
  var avcaacSrc = {
    mp4: [
      'https://your-mp4-h264-aac-url.mp4'
    ]
  };
  var av1aacSrc = {
    mp4: [
      'https://your-mp4-av1-aac-url.mp4'
    ]
  };
  // Then we can use the canPlayType method from getEnvironment API to determine 
  // if AV1 (Main Profile, level 2.1) and HE-AACv2 support is available
  src = avcaacSrc;
  if (env.canPlayType('native', 'video', 'mp4', 'av01.0.01M.08', 'mp4a.40.29')) {
    src = av1aacSrc;
  }
  // Then we set our player settings using the selected src object
  var settings = {
    licenseKey: 'your-license-key',
    src: src,
    width: 640,
    height: 360,
    contentMetadata: {
      poster: [
        'https://your-poster-url.jpg'
      ]
    }
  };
  var elementID = 'rmpPlayer';
  var rmp = new RadiantMP(elementID);
  rmp.init(settings);
</script>