Reducing Your Streaming Service Carbon Footprint

How Radiant Media Player can help you reduce your streaming service carbon footprint?

Radiant Media Player is committed to acting to preserve nature while conducting its business. As part of this effort Radiant Media Player has joined the Greening of Streaming organisation as a founding member.

The streaming media chain, from content capture to transcoding, hosting, CDN delivery and running end-devices can be a taxing industry for the environment (as much as the aviation industry as a matter of fact). Not only there is an energy cost to charging a smartphone to play video content but running a streaming service also has a notable carbon footprint - running the servers that prepare, host and deliver content.

While Radiant Media Player is only involved at the end of the streaming media chain, the viewing device also called the client, we can also participate in reducing the carbon footprint of consuming media content over the Internet. Make sure to review our best practices for building energy-efficient client-side media-oriented web applications blog post to get more insight on sustainability in the streaming media chain.

The consumeLessEnergy setting to reduce energy consumption in the client-side

With Radiant Media Player 7.3 we have introduced the consumeLessEnergy setting, compatible with MPEG-DASH and CMAF HLS streaming to Radiant Media Player. This setting, when enabled, will allow the player to query the viewer device capabilities and opt for a configuration where we can be sure that only the minimum required energy to play content is used by the end device. Examples:

• When multiple codecs are available for streaming in a DASH or HLS manifest we choose the one that consumes less energy on the client device (typically we will prefer hardware video decoding over software video decoding, as the latter consumes more energy)
• When multiple codecs are available with equivalent power efficiency we will select the one that has the lowest bitrates for its renditions
• The ABR algorithm is less agressive: more conservative when it comes to switching up and more liberal when it comes to switching down - therefore saving on bytes sent from the server while maintaining a proper overall viewing experience.

This can become especially relevant in a world where AVC/H.264 is no longer the vastly dominant codec and where DASH or HLS manifests may hold data for 2, 3 if not more codecs for video (AVC/H.264, VP9, AV1, HEVC/H.265) or audio (AAC, AC-3, Opus).

Of course there is a cost to the viewing experience. Even if a little cost. Using settings to reduce energy consumption, whether it is on the client-side or the server-side will always cause degradation in performance. This is why this setting is not enabled by default. While we believe that this performance cost is acceptable in light of reducing the carbon footprint of a streaming service, we also believe it is up to the viewer to decide to use energy-saving or best performance settings. This is why we often advise streaming service providers to have a "consume less" option that can be enabled by the viewer in a client-side application.

This kind of energy-saving optimisation is made possible thanks to the Media Capabilities API and some internal player logic around ABR algorithm.

consumeLessEnergy: Boolean

When set to true, the player will opt for a energy-saving configuration to stream content (where possible). Default: false.

Managed Media Source support

With Radiant Media Player 9.13.0 we support Managed Media Source on Apple devices (Safari 17.0+ for macOS and iPadOS and Safari 17.1 for iOS). This new API allows for better energy management and an overall better streaming experience for the viewer over the classic Media Source Extensions API. Managed Media Source on Apple devices is enabled by default for MPEG-DASH streaming. For HLS streaming we recommend using native HLS on Apple devices for better energy management. If you need to enable Managed Media Source for your use-case on Apple devices, you can do with setting forceHlsJSOnAppleDevices to true or hlsEngine to 'shakaplayer'. With time we hope more devices will adopt this new API for better energy efficiency accross the board.

Other settings and player code examples

As a complement to the consumeLessEnergy setting we have other optimisations available in our player to improve client-side efficiency. The following settings can help:

• capLevelToPlayerSize setting (enabled by default)
• ignoreDevicePixelRatio setting (enabled by default)
• Do not use autoplay (unless there is an absolute business requirement)
• Do not use content preloading (unless there is an absolute business requirement)

Coming up now with player code examples that will reduce client-device energy consumption with an acceptable impact on streaming quality.

Streaming with MPEG-DASH:

<!-- Include Radiant Media Player JavaScript file in your <body> or <head> -->
<script src="https://cdn.radiantmediatechs.com/rmp/9.16.6/js/rmp.min.js"></script>
<!-- Player container element -->
<div id="rmp"></div>
<!-- Set up player configuration options -->
<script>
  // For best results, input a MPEG-DASH stream with at least 2 different codecs for video
  const src = {
    dash: 'https://your-mpeg-dash-url.mpd'
  };
  // Your player settings
  const settings = {
    licenseKey: 'your-license-key',
    src: src,
    width: 640,
    height: 360,
    // Energy-efficient settings
    consumeLessEnergy: true,
    capLevelToPlayerSize: true,
    ignoreDevicePixelRatio: true,
    autoplay: false,
    preload: 'none',
    contentMetadata: {
      poster: [
        'https://your-poster-url.jpg'
      ]
    }
  };
  const rmp = new RadiantMP('rmp');
  rmp.init(settings);
</script>

Streaming with CMAF HLS:

<!-- Include Radiant Media Player JavaScript file in your <body> or <head> -->
<script src="https://cdn.radiantmediatechs.com/rmp/9.16.6/js/rmp.min.js"></script>
<!-- Player container element -->
<div id="rmp"></div>
<!-- Set up player configuration options -->
<script>
  // For best results, input a HLS stream with at least 2 different codecs for video
  const src = {
    hls: 'https://your-hls-url.m3u8'
  };
  // Your player settings
  const settings = {
    licenseKey: 'your-license-key',
    src: src,
    width: 640,
    height: 360,
    hlsEngine: 'shakaplayer',
    // Energy-efficient settings
    consumeLessEnergy: true,
    capLevelToPlayerSize: true,
    ignoreDevicePixelRatio : true,
    autoplay: false,
    preload: 'none',
    contentMetadata: {
      poster: [
        'https://your-poster-url.jpg'
      ]
    }
  };
  const rmp = new RadiantMP('rmp');
  rmp.init(settings);
</script>