Flash and HTML5 Video


Published on

Review of current video status in HTML5 and Flash

Published in: Technology
  • Be the first to comment

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide

Flash and HTML5 Video

  1. 1. Video wars HTML 7 5 and Flash <Flex : Career/>
  2. 2. HTML5 <ul><li>Drafts by WHAT WG </li></ul><ul><ul><li>Web Hypertext Application Technologies </li></ul></ul><ul><li>Merging into W3C specifications </li></ul><ul><li>“ One of HTML5’s goals is to move the Web away from proprietary technologies such as Flash, Silverlight, and JavaFX, says Ian Hickson, co-editor of the HTML5 specification.” —Paul Krill, reporting for InfoWorld, June 16, 2009 </li></ul><ul><li>Browser support </li></ul>
  3. 3. Fragmented Web - Description <ul><li>Multimedia coding on the web is fragmented </li></ul><ul><li>Many video codecs: </li></ul><ul><ul><li>DIVX, XVID, H.264 </li></ul></ul><ul><ul><li>WMV, VC-1, VP6 </li></ul></ul><ul><li>Many containers (File Format) </li></ul><ul><ul><li>AVI, MKV </li></ul></ul><ul><ul><li>MPEG4 FF, 3GPP </li></ul></ul><ul><li>Many delivery methods </li></ul><ul><ul><li>RTSP/RTP Streaming, Progressive download </li></ul></ul><ul><ul><li>Live HTTP, Smooth Streaming </li></ul></ul>
  4. 4. Fragmented Web - Challenges <ul><li>Proprietary Plug-ins - like Flash </li></ul><ul><li>Vertical market control on media distribution – like Apple </li></ul><ul><li>Media Distributers need to support many: </li></ul><ul><ul><li>Codecs </li></ul></ul><ul><ul><li>Containers </li></ul></ul><ul><ul><li>Delivery Formats </li></ul></ul><ul><li>in order to support all device and audiences </li></ul>
  5. 5. XIPH <ul><li>XIPH.org is a non profit organization which aims to create free multimedia coding standards </li></ul><ul><li>XIPH defined </li></ul><ul><ul><li>Vorbis – Audio codec </li></ul></ul><ul><ul><li>Ogg – a free file format media container </li></ul></ul><ul><ul><li>Speex – voice codec </li></ul></ul><ul><ul><li>Theora – Video Codec </li></ul></ul><ul><li>HTML5 Video first based its video codec and container standard on XIPH Standards </li></ul>
  6. 6. HTML5 Video <ul><li>HTML5 video first defined XIPH formats as the base HTML5 video: “User agents should support Theora video and Vorbis audio, as well as the Ogg container format.” December 10, 2007, the HTML5 specification </li></ul><ul><li>This was later replaced by a statement which basically stated: we cant make up our mind, use whatever you like. </li></ul>
  7. 7. HTML5 Video - Fragmented <ul><li>Support Theora (version of VP3) </li></ul><ul><ul><li>Old codec </li></ul></ul><ul><ul><li>Poor performance (BR/Quality ratio) </li></ul></ul><ul><ul><li>Free no royalties </li></ul></ul><ul><ul><li>Hardware support? </li></ul></ul><ul><li>Also H.264 </li></ul><ul><ul><li>Much better quality per bitrate </li></ul></ul><ul><ul><li>But it requires royalties…. </li></ul></ul><ul><li>Google opens VP8 </li></ul><ul><ul><li>Good Quality </li></ul></ul><ul><ul><li>No Royalties (?) </li></ul></ul>
  8. 8. HTML5 Video Code <ul><li>< videosrc =&quot; movie.ogg &quot; controls=&quot;controls&quot;>If you can see this text, your browser does not support the HTML5 video tag.</ video > </li></ul><ul><li>Source W3C School </li></ul>
  9. 9. Browser CODEC Support Browser Ogg Theora H.264/MPEG-4 AVC Internet Explorer NO 9.0 Mozilla Firefox 3.5 No Google Chrome 3.0 3.0 Safari No 3.1 Opera 10.50
  10. 10. WebM Project
  11. 11. WebM Overview <ul><li>Google Sponsored Project </li></ul><ul><li>Aims to create: Open , Royalty free media coding formats for the open web </li></ul><ul><li>Defines </li></ul><ul><ul><li>File Format / Container </li></ul></ul><ul><ul><li>Audio CODEC </li></ul></ul><ul><ul><li>Video CODEC </li></ul></ul>
  12. 12. WebM <ul><li>WebM fills the gap left by HTML5 standardization. </li></ul><ul><li>Defines: video, audio and container formats </li></ul><ul><li>Solves the royalty free Theora vs the superior quality H.264 by providing a royalty free video codec with the same (or better) video quality as H.264 </li></ul>Source: On2
  13. 13. Browser CODEC Support Browser Ogg Theora H.264/MPEG-4 AVC VP8 Internet Explorer NO 9.0 Plug-in Mozilla Firefox 3.5 No Yes Google Chrome 3.0 3.0 Yes Safari No 3.1 No! Opera 10.50 -
  14. 14. What is missing <ul><li>Standard Multi-bitrate support </li></ul><ul><li>HTTP Streaming (not PD) </li></ul><ul><li>Option for live streams </li></ul><ul><li>Transmit your camera (ChatRoulette Style) </li></ul><ul><li>P2P Interaction </li></ul><ul><li>Is that the Flash Killer? </li></ul>
  15. 15. Google Video and VP8
  16. 16. Google Video Strategy
  17. 17. OS Device <ul><li>PC </li></ul><ul><ul><li>Chrome OS </li></ul></ul><ul><li>Mobile </li></ul><ul><ul><li>Android </li></ul></ul><ul><li>TV </li></ul><ul><ul><li>Android </li></ul></ul><ul><li>Strategy: </li></ul><ul><ul><li>License OS to partners </li></ul></ul><ul><ul><li>Bind to SAAS Services </li></ul></ul>
  18. 18. Before we start <ul><li>VP8 goal is NOT to delivery the best video quality in any given bitrate </li></ul><ul><li>VP8 was designed as a mobile video decoder and should be examined in this context: </li></ul><ul><ul><li>VP8 vs H.264 base profile </li></ul></ul>
  19. 19. Google VP8 <ul><li>Last month, in Google IO (its developer confrence), Google released VP8 as open source </li></ul><ul><li>VP8 is a light weight video codec developed by On2. </li></ul><ul><li>VP8 provide quality which is the same/higher than H.264 base profile </li></ul><ul><li>VP8 memory requirements are lower than H.264 base profile </li></ul><ul><li>After optimization, VP8 might have better MIPS performance than H.264 base profile </li></ul>
  20. 20. Genealogy <ul><li>VP8 is part of a well know codec family </li></ul><ul><li>VP3 was released to open source to become XIPH Theora </li></ul><ul><li>VP6 is used in Flash video </li></ul><ul><li>VP7 is used in Skype </li></ul><ul><li>Motivation: </li></ul><ul><ul><li>“ No Royalties” CODEC </li></ul></ul>VP8 VP7 VP6 VP3 Theora
  21. 21. ADAPTATION – WHO USE IT? <ul><li>Software </li></ul><ul><li>Hardware </li></ul><ul><li>Platform & Publishers </li></ul>
  22. 22. Software Adaptation <ul><li>Android, Anystream, Collabora </li></ul><ul><li>Corecodec, Firefox, Adobe Flash </li></ul><ul><li>Google Chrome, iLinc, </li></ul><ul><li>Inlet, Opera, ooVoo </li></ul><ul><li>Skype, Sorenson Media </li></ul><ul><li>Theora.org, Telestream, Wildform. </li></ul>
  23. 23. Hardware adaptation <ul><li>AMD, ARM, Broadcom </li></ul><ul><li>Digital Rapids, Freescale </li></ul><ul><li>Harmonic ,Logitech, ViewCast </li></ul><ul><li>Imagination Technologies, Marvell </li></ul><ul><li>NVIDIA, Qualcomm, Texas Instruments </li></ul><ul><li>VeriSilicon, MIPS </li></ul>
  24. 24. Platforms and Publishers <ul><li>Brightcove </li></ul><ul><li>Encoding.com </li></ul><ul><li>HD Cloud </li></ul><ul><li>Kaltura </li></ul><ul><li>Ooyala </li></ul><ul><li>YouTube </li></ul><ul><li>Zencoder </li></ul>
  26. 26. Adaptive Loop Filter <ul><li>Improved Loop filter provides better quality & preformance in comparison to H.264 </li></ul>Source: On2
  27. 27. Golden Frames <ul><li>Golden frames enables better decoding of background which is used for prediction in later frames </li></ul><ul><li>Could be used as resync-point: </li></ul><ul><ul><li>Golden frame can reference an I frame </li></ul></ul><ul><li>Could be hidden (not for display) </li></ul>Source: On2
  28. 28. Decoding efficiency <ul><li>CABAC is an H.264 feature which improves coding efficiency but consumes many CPU cycles </li></ul><ul><li>VP8 has better entropy coding than H.264, this leads to relatively lower CPU consumption under the same conditions </li></ul><ul><li>Decoding efficiency is important for smooth operation and long battery life in netbooks and mobile devices </li></ul>Source: On2
  29. 29. Resolution up-scaling & downscaling <ul><li>Supported by the decoder </li></ul><ul><li>Encoder could decide dynamically (RT applications) to lower resolution in case of low bit rate and let the decoder scale. </li></ul><ul><li>Remove decision from the application </li></ul><ul><li>No need for an I frame </li></ul>
  31. 31. Talking heads, Low motion <ul><li>Low motion videos like talking heads are easy to compress, so you'll see no real difference </li></ul>
  32. 32. Low motion <ul><li>In another low motion video with a terrible background for encoding (finely detailed wallpaper), the VP8 video retains much more detail than H.264. Interesting result. </li></ul>
  33. 33. Medium motion <ul><li>VP8 holds up fairly well </li></ul>
  34. 34. High motion <ul><li>In high motion videos, H.264 seems superior. In this sample, blocks are visible in the pita where the H.264 video is smooth. The pin-striped shirt in the right background is also sharper in the H.264 video, as is the striped shirt on the left. </li></ul>
  35. 35. Very High motion <ul><li>In this very high motion skateboard video, H.264 also looks clearer, particularly in the highlighted areas in the fence, where the VP8 video has artifacts. </li></ul>
  36. 36. Final <ul><li>In the final comparison, I'd give a slight edge to VP8, which was clearer and showed fewer artifacts. </li></ul>
  37. 37. Quality Comparison
  38. 38. DSP-IP Contact information Download slides at: www.dsp-ip.com Course materials & lecture request Projects development services: Adi Yakov Training Manager [email_address] +972-9-8651933 www.dsp-ip.com Mail : [email_address] Phone: +972-9-8850956, Fax : +972-50- 8962910 <ul><ul><li>Alona Ashkenazi </li></ul></ul><ul><li>Development Services </li></ul><ul><li>[email_address] +972-9-8850956 </li></ul>