Radiant Media Player

Working with Peer5



Guide sections


Introduction

At Radiant Media Player we are committed to providing support for the latest technologies from the online video world. WebRTC-powered streaming offers a great way to improve viewer experience and to reduce content delivery cost. As such we have partnered with Peer5 to make Peer5 technology available with Radiant Media Player.

Peer5 is the first WebRTC-based CDN that does not require any software installation. By turning viewers into a video delivery network, Peer5 helps broadcasters improve the quality of the experience while reducing bandwidth costs by 50% or more.

In this article we will review how to use Peer5 WebRTC-powered streaming solution with Radiant Media Player.


Scope of support

Peer5 support in Radiant Media Player is currently available in HLS for on-demand, live or DVR content in the following environments:

  • Chrome for Desktop & Android
  • Firefox for Desktop & Android
  • MS Edge 79+ for Desktop
  • WebView for Android (Ionic, Cordova)
  • macOS and iPadOS Safari

All Radiant Media Player features can be used in conjunction with Peer5 technology. Where Peer5 support is not available (e.g. iOS Safari) the player will gracefully fallback to "classic" HLS delivery (e.g. not WebRTC-accelerated). You can obtain further technical information about Peer5 inner workings here.


Usage example

First you will need an account with Peer5 to obtain a Peer5 API Key. If you do not already have one you can contact Peer5 here.

We will now prepare our player code. To help you out we have made this as straight-forward as possible: you just need to add the JavaScript Peer5 library and the Radiant Media Player library to your page <head> and you are good to go. Yes it is that simple! For existing Peer5 customers you can also test Peer5 support in Radiant Media Player with our free 14-day trial.

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="initial-scale=1, width=device-width, viewport-fit=cover">
  <title>TODO supply a title</title>
  <!-- Include Peer5 library in your <head> -->
  <script src="//api.peer5.com/peer5.js?id=PEER5_API_KEY"></script>
  <!-- Include Peer5 plugin for Radiant Media Player in your <head> -->
  <script src="//api.peer5.com/peer5.radiant.plugin.js"></script>
  <!-- Include Radiant Media Player HLS-optimized library in your <body> or <head> -->
  <script src="https://cdn.radiantmediatechs.com/rmp/5.11.2/js/rmp-hlsjs.min.js"></script>
</head>
<body>
  <!-- Player container element -->
  <div id="rmpPlayer"></div>
  <!-- Set up player configuration options -->
  <script>
  // Streaming source - HLS in this example
  var src = {
    hls: 'https://your-hls-url.m3u8'
  };
  // Player settings
  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>
</body>
</html>

We have seen great results when using Peer5 solution with Radiant Media Player including faster player start-up and reduced buffering, significant content delivery cost reduction, increased streaming scalability and ultimately happier viewers.

So hop on the next-generation media streaming train and enjoy all Radiant Media Player features with Peer5 streaming solution.

Except as otherwise noted, the content of this page is licensed under the Creative Commons Attribution 3.0 License.