Radiant Media Player

Working with Peer5



Introduction

At Radiant Media Player we are committed to providing support for the best and latest technologies from the online video world. Peer-to-peer assisted streaming offers a great way to improve your viewer streaming experience and to reduce media content delivery cost. As such we have partnered with Peer5 in order to make the 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 peer-to-peer accelerated streaming with Radiant Media Player.


Scope of support

Peer5 support in Radiant Media Player is currently available for HLS in the following environments:

  • Chrome for Desktop & Android
  • Firefox for Desktop & Android
  • Opera for Desktop

Peer5 technology can be used for on-demand, live or DVR media content with Radiant Media Player. All Radiant Media Player features can be used in conjunction with Peer5 technology. Where Peer5 support is not available (MS Edge, Safari) the player will gracefully fallback to "classic" media content delivery (e.g. not peer-accelerated). You can obtain further technical information about Peer5 inner workings here.


Implementation

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

Then we will set up our player code. To help you out we have made this as easy as possible: you just need to add the JavaScript files for the Peer5 library and the Radiant Media Player plugin to your page <head> and you are good to go. You can keep using your Radiant Media Player code as usual - yes it is that simple! You can also test Peer5 support in Radiant Media Player with our free 14-day trial.

<!DOCTYPE html>
<html>
<head>
  <title>TODO supply a title</title>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
  <!-- 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 JavaScript file in your <body> or <head> -->
  <script src="https://cdn.radiantmediatechs.com/rmp/v4/latest/js/rmp.min.js"></script>
</head>
<body>
  <!-- Set up your wrapper div with its unique id -->
  <div id="rmpPlayer"></div>
  <!-- Set up player configuration options -->
  <script>
  // First we specify bitrates to feed to the player
  var bitrates = {
    hls: 'https://streamingrmp-1479.kxcdn.com/vod/smil:bbb.smil/playlist.m3u8'
  };
  // Then we set our player settings
  var settings = {
    licenseKey: 'your-license-key',
    bitrates: bitrates,
    delayToFade: 3000,
    width: 640,
    height: 360, 
    poster: 'https://www.radiantmediaplayer.com/images/poster-rmp-showcase.jpg'
  };
  // Reference to the wrapper div (unique id)
  var elementID = 'rmpPlayer';
  // Create an object based on RadiantMP constructor
  var rmp = new RadiantMP(elementID);
  // Initialization ... test your page and done!
  rmp.init(settings);
  </script>
</body>
</html>

We have seen great results when using Peer5 with Radiant Media Player including faster buffering, increased streaming capacity and ultimately happier viewers. So hop on the next-generation media streaming train and enjoy all Radiant Media Player rich features with Peer5 peer-to-peer acceleration technology.

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