
HTTP Live Streaming in JavaScript - shacharz
https://blog.peer5.com/http-live-streaming-in-javascript/
======
sesm
The problem with Apple HLS is that it uses MPEG TS container, which is not
supported natively by the browsers (except Safari). So, any implementation of
HLS in Chrome/Firefox should do the job of extracting video/audio from
container using JavaScript (or Flash, like FlashHLS player does).

A more standard-friendly solution is MPEG DASH, which is similar to HLS, but
can use MP4 container supported natively by the browsers (as a part of HTML5
video standard)

~~~
praseodym
The MPEG-TS container (from 1995!) is also a lot less efficient than the more
modern MP4 container. Overhead can range from 5% to 30% with bad muxing
settings.

See: * ​[http://blog.zencoder.com/2011/12/08/announcing-the-clouds-
mo...](http://blog.zencoder.com/2011/12/08/announcing-the-clouds-most-
efficient-http-live-streaming/) *
​[http://features.encoding.com/blog/2014/02/24/simplify-
http-l...](http://features.encoding.com/blog/2014/02/24/simplify-http-live-
streaming-encoding-com-hls-segmenter/) *
​[http://stackoverflow.com/questions/15661664/how-do-i-
alter-m...](http://stackoverflow.com/questions/15661664/how-do-i-alter-my-
ffmpeg-command-to-make-my-http-live-streams-more-efficient) *
[https://trac.ffmpeg.org/ticket/2857](https://trac.ffmpeg.org/ticket/2857)

~~~
cpeterso
I wonder how much of the transcoding of MPEG-TS to MP4 for MSE could be
written in optimized asm.js code.

------
jaitsu
Great article. I think we can actually talk about flash being replaced now
that we have a real solution for HTML5 live streaming. Flash was never going
to go away until there was something that could handle the DRM across all
browsers.

I've worked a lot with Ooyala's live streams and was just looking at moving a
client over to their HTML5 offering. They claim to offer it in all browsers
but that is probably with a flash fallback, they haven't open sourced their JS
(or at least I can't see it on their GitHub page).

We also use StreamUK on a lot of sites (but I've never used it directly) and
from what I have heard they have great support for HLS. They have no GitHub
presence so not quite sure if they're using the same libs the article
mentioned or something proprietary.

Obviously DRM would still be an issue unless the browser natively supports
EME.

~~~
voltagex_
>All tests were done on Intel Corei7-4810MQ machine.

I think we'd have to see 60fps on a Chromebook or similar low-cost machine
before we declared the end of Flash streaming.

~~~
shacharz
I agree we should do tests on low-cost machines as well. But at least on my
machine the js libraries performed better than the Flash ones. So moving to
flash-less should improve performance.

------
Jerry2
>but Chrome, Firefox, and IE still don’t use this technology on their desktop
versions

Actually, since version 11, IE supports HLS. [0]. When Apple streamed their
last event, they mentioned on the video page that IE11 is supported. That's
when I found out about it.

[http://blogs.msdn.com/b/ie/archive/2015/01/29/simplified-
ada...](http://blogs.msdn.com/b/ie/archive/2015/01/29/simplified-adaptive-
video-streaming-announcing-support-for-hls-and-dash-in-windows-10.aspx)

~~~
praveenster
IE11 running on Windows 10

------
chrisdinn
> Dash basically takes all of the good stuff from HLS and gets rid of the bad
> pieces.

Not sure I would use that sentence to describe a standard that replaces the
extended M3U file format (it really whips the llama's ass) with yet another
complex XML document.

MPEG-DASH is less of a video standard itself and more of a set of guidelines
for new set of adaptive-bitrate streaming standards like DASH-AVC/264.

------
orasis
As one of the inventors of HLS, I find this pretty damn impressive.

------
aspirin
Great to see progress, but 1668 dropped frames in the test is a bit
underwhelming.

~~~
shacharz
Yea, but it is HD, 60fps. The javascript libraries are dropping ~1 frame per
second Flashls (which is better) dropped ~3 frames per second

------
vdnkh
This is a great article! Been thinking of writing one myself for a while now.
I have a project
([https://github.com/johnBartos/RadioFreeTwitch](https://github.com/johnBartos/RadioFreeTwitch))
which siphons Twitch's HLS streams and extracts the audio-only portion from
its manifest file. Up until recently, it's been near impossible to get a
reliable, easy to use solution for non-flash HLS. So I shelved the project
until the technology matured. Just last night I decided to take a crack at a
flashless solution and was blown away by how easy it was - I use Flowplayer,
and hlshjs ([https://github.com/flowplayer/flowplayer-
hlsjs](https://github.com/flowplayer/flowplayer-hlsjs)) was just plug-and-play
for me.

------
praseodym
A better solution would be to deploy a media server that can provide multiple
stream formats. For example, Microsoft IIS Media Services [1] supports
Microsoft's Smooth Streaming, HLS and MPEG-DASH without having to re-encode
video for each format.

With such a solution, nearly every client out there can use a natively
supported stream format without overhead. Also, Microsoft has a decent cloud
offering with Windows Azure Media Services [2] that fixes all of this for you,
including optional DRM.

[1] [http://www.iis.net/media](http://www.iis.net/media) [2]
[https://azure.microsoft.com/en-us/services/media-
services/](https://azure.microsoft.com/en-us/services/media-services/)

~~~
madeofpalk
I think at the end of the day the better solution for most people would be to
use something like Brightcove, The Platform, Ooyala, Adobe, paid Vimeo, or
even Youtube.

Unless you're Netflix, I wouldn't bother with this stuff yourself. Even then,
a lot of (A)VOD sites 'outsource' this stuff to Brightcove or The Platform.

~~~
shacharz
If you want white label solution, using Brightcove, Ooyala, etc' are too
expensive for certain business models.

------
erikpukinskis
This plus webrtc bittorrent = decentralized video broadcast?

~~~
pronoiac
I think BitTorrent was only using Flash because it offered portability across
browsers and OSes. I wouldn't be too surprised to see them switch to using
html5 instead.

------
timrpeterson
This article needs to get more up votes. Really imoportant stuff.

------
cpeterso
The article is incorrect on a couple points. Firefox for Android does not
support HLS natively. And IE11 and Edge do support HLS natively on desktop.

Here is the Firefox bug (from 2010) tracking HLS support:
[https://bugzilla.mozilla.org/show_bug.cgi?id=577084](https://bugzilla.mozilla.org/show_bug.cgi?id=577084)

------
dmm
Has anyone implemented HLS or DASH in an application that required low-
latency? How low were you able to get it?

With DASH I have been able to achieve 5s by using small chunks and a short
interval between iframes.

~~~
shacharz
I've talked with a few guys from jw and videojs They've said to reach sub 2s
using hls. They did that with <1s chunks and progressive streaming of a single
chunk.

------
MrBra
Could anyone please simplify this and explain how this is different from
playing videos with HTML5 <video> tag?

------
Zypho
Pretty interesting read. However this won't fully replace a flash
implementation until we have AES-128 decryption support.

