VidTech

Firefox HLS and MPEG-DASH Support with Bitmovin

Stefan Lederer
. 2 min read
Firefox hls support and dash support.

As one of the major browsers, Firefox officially released its support for the MSE in version 42, which is now available to the public and can be downloaded at the Firefox website! This is another step towards replacing Flash and adaptive streaming in HTML5. But what is the so called MSE and why is it important in the context of online video streaming?

The MSE in a Nutshell

The MSE is a specification that extends the HTMLMediaElement to allow JavaScript to dynamically construct media streams for audio and video tags. This wasn’t possible before, as these tags only had the possibility to access full files i.e. mp4 files. This approach is also called progressive streaming or progressive download, as the media files are downloaded and played at the same time to enable pseudo streaming. However, this comes with poor seeking support, and no possibility to adapt the video/audio quality to the real bandwidth situation of the user. By constructing media streams in JavaScript as input for the audio and video tag, developers can now dynamically adapt the media stream to the user’s context, and thus improve the streaming experience.

How to make use of the MSE?

The following JavaScript code snippet shows the use of MSE:

var mediaSource = new window.MediaSource();
mediaSource.addEventListener('sourceopen', function() {
  var sourceBuffer =     mediaSource.addSourceBuffer('video/mp4;codecs="avc1.42c00d"');
  sourceBuffer.appendBuffer(initSegment);
  sourceBuffer.appendBuffer(mediaSegment);
});
videoElement.src = URL.createObjectURL(mediaSource);

Once this MediaSource is initialised, a SourceBuffer for the media data is created, which can be fed with the downloaded segments. Here it is important that we have to tell the SourceBuffer what type of media it will get, e.g. audio or video, which codec or which container format. Furthermore, the audio or video decoder needs to be fed with initialization information which is provided with a so called initialization segment. This special segment may also be present for the different resolutions and quality versions of an audio or video stream, as codecs like h.264 need that information to properly decode.
Content generation is also straight forward and supported by open source tools such as x264 and MP4Box, as well as commercial encoding services such as the Bitmovin Cloud Encoding Service.

Does my Browser Support the MSE?

After a couple of years of slow adoption of the HTML5 and in particular the HTML5 MSE by browsers, we now see the majority of them supporting it. To check if your browser is equipped with the MSE, have a look at this useful resource. MSE support.

To get an overview of the today’s status of HTML5 MSE and EME support across browsers and platforms, please have a look at the related section on our website.

Conclusion

The HTML5 MSE support in major browsers is a big step towards an ecosystem consisting of open standards for video on the web, and replacing plugins such as Silverlight. However, to reach 99% of the users, we have to have a video streaming setup which supports also older browser versions. Those older browsers can be served easily using a Flash-based player which can play back the same MPEG-DASH content, which is also used by the HTML5 MSE.
Unified video solutions across different platforms and devices will increase the customer experience by the usage of adaptive streaming formats, prevent buffering, decrease loading times and provide the best possible quality for each user’s individual bandwidth and device situation.
Thanks and best,
the Bitmovin Team
Follow us on Twitter: @bitmovin

Stefan Lederer

Stefan Lederer

Co-Founder & CEO

Stefan Lederer is a renowned innovator and thought leader in video streaming with a strong background in academic research. Stefan co-created the MPEG-DASH video streaming standard and has contributed to several open-source tools, including DASHEncoder, DASHoverCCN and VLC plugin. Stefan also serves as an external lecturer at the University of Klagenfurt.


Related Posts

Firefox hls support - Bitmovin
VidTech

New Firefox AV1 support for Encrypted Media Extensions

Join the conversation