The Future of Online Video

Darcy Clarke

Developer, Designer, UX Advocate

We'll Cover

History, Current Landscape & "The Future"

ie. Codecs, Containers, Encoders, Decoders, Experiences,
Digital Rights Management & Encrypted Media Extensions

History of Video

Codecs, Containers & Playback

1986 - Sony release D1

  • First digital video recording format
  • Stored 94 minutes
  • Uncompressed

1988 - Sony & Ampex release D2

  • Offered simultaneous playback
  • Stored composite video over component
  • Still uncompressed

1988 - H.261 is released

  • First member of the H.26x family
  • Most all subsequent video coding standards are based on it
  • Used compression


  • - Coder + Decoder
  • - Compresion + Decompresion

1994 - The Duck Corporation release TrueMotion

  • Didn't require a seperate decoder
  • Had lossy video compression
  • Used an AVI file container

2000 - On2 Technologies release VP3

  • 2001 was donated to open source
  • 2002 Theora is created and uses VP3 as it's basis
  • In 2013 Google's WebM format upgrades support VP9

History of Playback

Video Playback in 1991

Video Playback in 1995

Video Playback in 1996

Video Playback in 1997

The Aftermath...





February 28th, 2007

Opera Proposes <video> element

~ W3C Mailing List Thread Announcment


Defective By Design on DRM

DRM creates a damaged good; it prevents you from doing what would be possible without it. This concentrates control over production and distribution of media, giving DRM peddlers the power to carry out massive digital book burnings and conduct large scale surveillance over people's media viewing habits.

Encripted Media Extensions (EME)


an API that enables web applications to interact with content protection systems, to allow playback of encrypted audio and video.

Encripted Media Extensions (EME)

Interpretation: A standard that will give corporations primitive security to protect IP through browser backdoors and, in turn, waste everyone's time.

Build Experiences with Video


JavaScript Encoders, Decoders & Codec

Why JavaScript?

  • Not Proprietary
  • More Control
  • Provides an Alternative to Backdoor Specifications
  • It's Awesome!

JavaScript Video Encoders





JavaScript Video Decoders



  • Narrow file requirements
  • Picky implementation
  • MPEG1 is a poor, out-dated format
  • No audio

WEBM: vp8-webm-js-decoder

WEBM: vp8-webm-js-decoder

  • Performance on desktop ~20-30fps
  • Performance on mobile <10fps
  • No audio

MP4: Broadway.js

OGV (Theora): OGV.js

JavaScript: ORBX.js

JavaScript: ORBX.js

  • 25% better compression than H.264
  • Adaptive bit-rate (while streaming)
  • Better color depth
  • Better intra-frame coding
  • IP-blind runtime
  • Flexibile
  • Open Source

Mozilla and OTOY deliver the power of native PC applications to the Web, unveil next generation JavaScript video codec for movies and cloud gaming


The Future of Video is...

  • Encrypted Media Extensions
  • Immersive, Interactive Experiences
  • JavaScript Video Codec


Twitter: @darcy

Github: @darcyclarke

One more thing....


~ Guillaume C. Marty (Mozilla)


  • IFO files are parsed to JSON
  • Chapters are generated as WebVTT
  • NAV packets are extracted to JSON
  • The buttons size/position are saved to CSS
  • The menu still frames are saved to PNG
  • VM commands are compiled into JavaScript
  • The video is encoded to WebM