HTML5 Video Part Deux

Video thumbnail (Frame 0) Video thumbnail (Frame 932) Video thumbnail (Frame 1930) Video thumbnail (Frame 4849) Video thumbnail (Frame 6278) Video thumbnail (Frame 18141) Video thumbnail (Frame 19059) Video thumbnail (Frame 20231) Video thumbnail (Frame 21560) Video thumbnail (Frame 22684) Video thumbnail (Frame 37308) Video thumbnail (Frame 38546) Video thumbnail (Frame 41809) Video thumbnail (Frame 43580) Video thumbnail (Frame 44839) Video thumbnail (Frame 46624) Video thumbnail (Frame 47844) Video thumbnail (Frame 48814) Video thumbnail (Frame 49769) Video thumbnail (Frame 50739) Video thumbnail (Frame 51727) Video thumbnail (Frame 54186) Video thumbnail (Frame 55242) Video thumbnail (Frame 59282) Video thumbnail (Frame 60227)
Video in TIB AV-Portal: HTML5 Video Part Deux

Formal Metadata

HTML5 Video Part Deux
New Opportunities and New Challenges
Title of Series
CC Attribution 2.0 Belgium:
You are free to use, adapt and copy, distribute and transmit the work or content in adapted or unchanged form for any legal purpose as long as the work is attributed to the author in the manner specified by the author or licensor.
Release Date

Content Metadata

Subject Area
This talk gives a close look at second wave HTML5 features around video delivery — specifically, mediaSource API / adaptive streaming, encrypted media extension and WebRTC. We look at open tools and techniques for transcending platform limitations and delivery these experiences across increasingly diverse set of devices and platforms. Real world usage examples are highlighted from experience with open tools we have built and integrated. This presentation outlines real-world production usage of second wave HTML5 video features with a focus on technical integration into arbitrary application contexts and the trade offs for targeting a given feature set. We begin with a short review of challenges in the first wave of HTML5 video; codecs, consistent JS API and lack of unified adaptive streaming support standard. We then transition into HTML5 Part Dux and see how "the sequel" is a lot like the original with respect to a powerful new set of features but with equally impressive platform fragmentation and API inconsistencies. We highlight the compounded challenges of the entrance of additional mobile and smart tv platforms generating more device targets to support then ever before. We review open video platform solutions developed to bridge these limitations on native devices. Specifically we look at the technical architecture of a native video component that we have built to bridge android and iOS web view limitations in an native environment while seamlessly leveraging a feature rich HTML5 player platform. We also review the current state of mpeg-dash and highlight technical inconsistencies in implementation that drive the use of shared code libraries such as dash.js. We preset our production dash.js usage for VOD, Live and associated encrypted media extension options for content controls, along with technical implementation details to help inform integration options and trade offs. Finally we look to WebRTC and the types of experiences it can enable and how they can be delivered within the contemporary platform ecosystem. We look at technical approaches towards enabling usage and cross platform delivery options
Videoconferencing Self-organization
Enterprise architecture Standard deviation Service (economics) Open source Software developer Mereology Product (business) Wave Computer animation Hypermedia Videoportal Quicksort Computing platform
Slide rule Building Momentum Computer file Multiplication sign Real number Flash memory Mass Web browser Web 2.0 Revision control Programmer (hardware) Hypermedia Different (Kate Ryan album) Operator (mathematics) Videoconferencing Multimedia Plug-in (computing) Computing platform Collaborationism Addition Standard deviation Bit Computer animation Software Internet service provider Speech synthesis Right angle Quicksort Window
Revision control Mechanism design Computer animation Different (Kate Ryan album) Code Consistency Computer hardware 1 (number) Computing platform Physical system
Torus Android (robot) Topological vector space Machine code Java applet Multiplication sign Decision theory Source code Range (statistics) Real-time operating system Client (computing) Mereology Web 2.0 Casting (performing arts) Sign (mathematics) Hypermedia Different (Kate Ryan album) Videoconferencing Physical system Overlay-Netz Area Scripting language Touchscreen Wrapper (data mining) Software developer Binary code Electronic mailing list Bit Benchmark Connected space Message passing Telecommunication Order (biology) Right angle Quicksort Arithmetic progression Implementation Sequel Open source Virtual machine Web browser Black box Streaming media Event horizon Code Revision control Natural number Computer hardware Computing platform Compilation album Plug-in (computing) Standard deviation Scaling (geometry) Projective plane Planning Vapor Cartesian coordinate system Limit (category theory) Peer-to-peer Graphical user interface Word Computer animation Integrated development environment Software Personal digital assistant Universe (mathematics) Game theory Communications protocol Near-ring Library (computing)
Standard deviation Distribution (mathematics) Graph (mathematics) Content (media) Mass Theory Web 2.0 Digital rights management Computer animation Hypermedia Plug-in (computing) Physical system Spacetime
Code division multiple access Standard deviation Open source Content (media) Web browser Mereology Product (business) Formal language Web 2.0 Computer animation Software Encryption Videoconferencing Quicksort Freeware Computing platform Descriptive statistics Physical system
Web 2.0 Prime ideal Distribution (mathematics) Computer animation Personal digital assistant Multiplication sign Videoconferencing Flag Spacetime
Complex (psychology) Android (robot) Topological vector space Group action Context awareness Beta function Code State of matter Decision theory Multiplication sign Combinational logic Parameter (computer programming) Mereology Subset Web 2.0 Fraction (mathematics) Derivation (linguistics) Component-based software engineering Hypermedia Different (Kate Ryan album) Videoconferencing Software framework Extension (kinesiology) Physical system Social class Thumbnail Scripting language Arm Mapping Electronic mailing list Bit Message passing Process (computing) Telecommunication Order (biology) Configuration space output Website Quicksort Web page Trail Slide rule Functional (mathematics) Sequel Flash memory Control flow Online help Web browser Streaming media Event horizon Metadata Product (business) Frequency Goodness of fit Internet forum Term (mathematics) Internetworking Bridging (networking) Computing platform Operating system Computer-assisted translation Associative property Computing platform Mathematical optimization Plug-in (computing) Computer architecture Domain name Standard deviation Focus (optics) Dependent and independent variables Distribution (mathematics) Shift operator Inheritance (object-oriented programming) Consistency Weight Content (media) Plastikkarte Analytic set Set (mathematics) Limit (category theory) System call Graphical user interface Computer animation Integrated development environment Logic Personal digital assistant Einbettung <Mathematik> HTTP cookie Abstraction Window Library (computing) Computer worm
Android (robot) Group action Machine code Source code Mereology Number Web 2.0 Component-based software engineering Hypermedia Natural number Videoconferencing Diagram Software framework Computing platform Position operator Computer architecture Scripting language Touchscreen Projective plane Content (media) Analytic set Instance (computer science) Geometric quantization Computer animation Integrated development environment Software Logic Personal digital assistant output Normal (geometry) Right angle Summierbarkeit Quicksort Wireless LAN Abstraction
Point (geometry) Demo (music) Source code Sampling (statistics) Content (media) Web browser Open set Event horizon Web 2.0 Computer animation Hypermedia Personal digital assistant Buffer solution Videoconferencing Object (grammar) Quicksort
Revision control Computer animation Software Bit Quicksort Streaming media Hydraulic jump 2 (number)
Demo (music) Key (cryptography) Projective plane Streaming media Set (mathematics) Mereology Connected space Peer-to-peer Web 2.0 Message passing Data management Computer animation Hypermedia Term (mathematics) Personal digital assistant Order (biology) Encryption Videoconferencing Summierbarkeit Whiteboard Quicksort Physical system Library (computing)
Point (geometry) Computer animation Source code Projective plane Bit Streaming media Quicksort Table (information) Event horizon
Peer-to-peer Server (computing) Computer animation Hypermedia Source code Projective plane Content (media) Combinational logic Video game Bit Quicksort Spacetime
Scripting language Key (cryptography) Computer file Java applet Projective plane Electronic mailing list Line (geometry) Web browser Web 2.0 Computer animation Hash function Encryption Point cloud Quicksort Extension (kinesiology) Traffic reporting
Slide rule Email Perfect group Link (knot theory) Direction (geometry) Software developer Projective plane Combinational logic Sampling (statistics) Streaming media Open set System call Connected space Type theory Mechanism design Computer animation Personal digital assistant Videoconferencing Website Quicksort Spacetime Computer worm Library (computing)
Content delivery network Point (geometry) Source code Flash memory Workstation <Musikinstrument> Water vapor Mereology Web 2.0 Hypermedia Term (mathematics) Videoconferencing Computing platform Encryption Data conversion Logic gate Focus (optics) Standard deviation Information Content (media) Arithmetic mean Friction Software Telecommunication Quicksort Communications protocol
Installation art Gateway (telecommunications) Computer animation Atomic number Interface (computing) Quicksort Proxy server
Server (computing) Presentation of a group Local area network Multiplication sign View (database) Decision theory Firewall (computing) Source code Web browser Client (computing) Information privacy Product (business) Web 2.0 Goodness of fit Bit rate Meeting/Interview Term (mathematics) Atomic number Internetworking Natural number Hypermedia Selectivity (electronic) Plug-in (computing) Algorithm Connected space Vector potential Type theory Googol Computer animation Software Personal digital assistant Network topology Website Self-organization Right angle Quicksort Communications protocol
welcome to Johnson just look for the talk of my they about HTML 5 video talk to and if you're hints if you want to leave during the talker during the question and
answer session please leave quietly so the others of those of the other organs has a chance to still listen to the talk to the question answered and if you leave through the lower back toast please make sure that the doors shut because of the bar outside it's quite out of the doors opened so if you leave me through the lower those please shut the doors behind him thank you think so
low on and know give a talk about regional 5 part of the parts
to and basically were looking at each channel 5 is sort of the 2nd wave of features that have come about and within the standards bodies and kind of the possibilities that they enable that the I Michael Dale and director of product that culture and a longtime open-source media developer on what is a lot we probably don't know what culture is that it's an open source online video platform we do a lot of business to business relationships is used in education enterprise many entertainment and service
providers and we get a lot of first-hand experience with sort of delivering an HTML 5 experience time
and therefore also get a lot of first-hand experience with the the the gap between the promise of extremophiles and what's possible what's going quickly look a little bit of history of wide wide small 5 on the web right we we had if people recall a few years back out there was Windows Media plugin QuickTime media plugin real Media plugin lot different ways to play video it was largely dysfunctional and flash really came along provided like a unified as standard and but I was obviously wasn't an open standard it wasn't something I was implementable and free software it wasn't something that I a free browser could implemented natively so out of that speech not by video tag was born we had operation and Firefox building nearly versions of the video tag and and really sort of provided the initial impetus for the additional video tag meanwhile apples busy working on sunny little new devices in which really set the stage for the the main corporate narrative of additional file slides in in the mass usage which was basically the iPhone not shipping flash on this basically Apple promoted the work bootstraps the messaging around each 5 which was a fully open and control platform widely respected standards bodies and it it delivered this promised and that we would have as collaboration among different vendors by implementing no for the shared beautiful weather right once the dream of all programmers right to be a bright
ones and have at work across the different platform targets that you need to support and performance that was comparable to native or at least and mechanisms to get directly at the graphics hardware for a resource-intensive tasks like on the CSS are accelerated rendering pipelines and continuously updated so you have these systems that would not involve also
was can been evolving standard and we would get the new features of a standard why we just distributed Nuno rainbows kittens and unicorns it didn't quite work out that way because there was initially gave a code at a conflict which was Apple was not really on board with royalty-free connects neither was Nokia as they proclaimed on there was not really a consistent JavaScript API we had different mobile
implementations in adapting the small 5 standard to their own idea what's I would be best for the user so that the resulting pretty pretty substantive limitations within the iPhone environment to back to this day still exist which is for example no no HTML overlays during full screen so that's a pretty substantive limitation because you can't build any application that has any supplemental video experience it's it's only the the video around and then adaptive streaming also still a problem and in the course of those parties that never showed up like an hour showed up late to the party I guess you could say there was a lot of doubt whether Microsoft was going to fully implement the standard in an Adobe was also obviously resisted it for obvious reasons initially and then Android is well sort of ship to broken version of it for a while but we did get some resolution and within the 1st wave of relational 5 years standards we we sort of got H 2 6 4 4 for better or worse on Cisco's sort of release for binary and sort of promoting interoperability within the free software with the the best they could do about at this juncture which is sort of a binary that can be as shipped to downstream and it is looking better for the future and we have this quote here from Cisco but they're excited about the future of a dollar it's going to be another very interesting technological and development the contributing to the project and this is sister right the there and legally of licenses you know so it's not like some small hit the an open-source company like Google is CIA broader broader adoption overall judge people pushing forward with the standard but of of a royalty-free correct the on it's any small part has gone past if if nothing else but we can see that the projects with Mozilla the 8 AS endogenous on compilers is still making progress is released an update late last year with vapor getting down to 1 . 5 x native speeds which is amazing right like within a Java Script shipped codes from they and they say that you need to get past so it it'll become native and I believe that shipping native code will have very little performance difference in the near future something off something along the lines of like a virtual-machine machine versus a running on hardware and we'll will see that happening over the next few years and even Apple is making some serious progress on on where the you know as long as it's in their Safari browser you we've seen increases between I was 6 hours 7 a full 70 per cent boost in some benchmarks up to 4 times faster than I mean this is and this is for a sort of a gaming bench mark octane JS baby fixed the STG rendering so got 200 x improvement or basically works now on they did a lot of a lot of improvements there is but it's not it's not always suffer all use cases right like the lot of improvements apples and apples doing don't directly make their way into the so when you were the embedded web you which would sort of be necessary for abstract packaging and so why do we need a video standard sequel I'm wall there's more stuff that needs to be resolved active streaming never was really resolved in the 1st pass of real-time audio video communications exciting area whether something that's possible then desktop that isn't possible and on the Web today is something that we should make happen and MDR and many think that's not necessarily part of this it should be part of a single but it's it's also happening and then additional finance be more places right like we need to th the running on a wider range of phones need to be able to run on more screens are like TV how are we going to enough for free small fight really be this universal application delivery platform is an astronomer environments so now we enter into the the sequel and now with even more devices and even more powerful than divided the the so let's let's look a little bit of what I characterize some of the major new features then of Nacional flies standards bodies as as I guess 1st I would like to see an exciting you know real time video conferencing tool that you can also this screen sharing this this really enables all sorts of applications that previously required sort of from you know a lot more infrastructure and we have the peer to peer data channel which opens up a lot of possibilities which will look into a little bit later our support for a waiver to see where we have really got a lot of word on that front from Apple and Google is is a big supporter of that that's it takes time to for to propagate the fragmented and the universe Microsoft sort of supporting something of that nature they they have certain alternate signaling a protocol which kind of complicates things is it's debatable why the wire how they're dragging their heels on a torus it's just you will see how it all plays out over time and Mozilla yes it supports it and you can actually today do videoconferencing between Chrome and Mozilla on on shipping versions of the browser opera as well but they're just a wrapper for chromium so the more web adjusted upwards of media source extension that's the system for sort of the pending writes that enables things like and a dashed and and my video streaming on a scalable have system so it's this differ from Weber RTC which opens sort of of a data channel offer low latency of light video communication verses are obtained by the API which works really well ascidians an HTTP based connections and sort of just appends bytes to a media stream in order to support from but liven deity of recipients quick tension that is that and then so what's going on over the list of items here we have an apple not really keen on supporting and they have their own sort of less standard that they more or less a committed to cool is working on was you know up first-class supporter of the Microsoft as well as supports a very well they can in 11 in and Mozilla also plans to support it but not quite there yet so smart TVs mostly are committed to wait unless we haven't seen it too much uncertainty so those mighty be plan to implement and pay that it it's not quite the same thing because of a media source API gives a lot more flexibility in you can actually take into account of the network network events on a global scale as opposed to just as it had been a black box that the client makes decisions against or opaque thing and then of course from caste
is the sort of the signing shining white coming in verbal communication with i it basically supports the full additional 5
API and you know you can just plug into a TV and then we got a nation of eyebrows rounded to be essentially wall of the highly you optimize it's more like er the and then we have the
encrypted media extension and this enables you know API to interact
with content detection systems and basically it's DRM on the web and in theory would enable things
that you know not just hunted controls but also things like that Snapchat's but with more steps still to work around the copied and then also cost massive debates on the ethics of standard bodies Apple again no common probably in wall mobile see what Apple those that space it's not they're not big promoter of of protected contin distribution outside of the App Store on Google big supporter Microsoft as well but also not so likely mean it's even more complicated than the H 2 6 4 bits as as you see it unencrypted mediates interview to sort of look at the graph here it's a should be fairly
straightforward you really can't have of free software system I mean basically this this part here is CDM the content description decryption model that inherently has to be close and it it ties in to your platform so that's that's something that obviously won't fly with the open source browser but other than that I had something that's part of the standard I went GL I
included here just because it's kind of kind of a tangentially related video technology and there are some interesting possibilities been opened up my face that there's been some web CL-based Codex delivery of so basically been able to decode video has sort of optimizing it for the the shaded language that you have available to you through open
GL and so some some folks have written
some of Codex optimized use case so there's interesting possibilities in the in the video space for web of
the the distribution looks brighter than it did a few months ago Microsoft is committed to shipping and I 11 so a lot of a lot of folks that sort of
claim that it's now ready for prime time muscle of course has been a longtime promoter of the Google's well Apple has only only supports it for their i add standard and perhaps can enable it and so unfortunately only have things like this which is almost annoying is shipping when GL that putting it behind a flag and then outline that apply to inter webstore almost as
much as annoying the everyone wants to make their own mobile platform that's that's another big challenge of the of the standards process with in the sequel as we have the Firefox OS the manually snap in some these cases obviously they map over to sort of existing software platform so it's not going to be sort of a whole new browser to be supported by their it does just mean a broader broader set of platforms to be engaged with we have the Windows Phone which has differences between RT in there and Windows proper operating system the Tyson Samsung has hinted at potentially putting effort behind that and sort of a WebKit derivatives so it should be not entirely too painful so by fear is not completely dead in emerging markets the boon to we would assume they use some standard web from standard web rendering platform I actually apples 5 support is sort of frozen in time as they as they move forward with the native support and again mean and and write the can mention enough and trade platform is incredibly fragmented lots of lots of challenges that an the and then not only does everyone or make their own phone every once make their own t distribution as well so we have the Sony P S 4 let's get based but not necessarily letting you shift your own it WebKit depends on the App Store model and Google had an interview that has now shifted focus starts Comcast which I think is then a really good shift in focus the the crumb passes is a really nice platform to to target on Windows 8 X marks 1 apple to be roku smart TV platforms lots of lots of stuff I think I think we'll see a little bit of a I think having so many different vendors will sort of help the standard process in the long term because there won't be as much as central control over what becomes the de facto standard in the we we suffered a lot of or there's been sort of a breaks put on the process just because Apple has had such a wide what percentage of the distribution and so sort of a what they do is becomes Italy's not common denominator but if enough other platforms are in the states I think over time it'll promote the standards but in the meantime there's lots of challenges and yeah so again the sequel looks a lot like original 3 call slide of some of the challenges we faced with the 1st so where regional 5 features we have similar problems inconsistent by and the on the road map is also a big problem with with at least with Mozilla and to a slightly lesser extent chrome you have to have a very clear roadmap that with you know Public forums Public wikis that document you know where where the platform thing to be in a certain period of time and then you can sort of see that and make the design design decisions going forward Our architectural decisions on with some the other platforms not so much no that's very up in the air what Apple do from 1 day to next and and literally just happened the data they share their beta for the new operates system that's becomes the day that it's defined so and in many platforms axis is the still consistency are inconsistent performance new so we so itional fighters got a lot faster in in terms of the 1st class browser experience but as you try to and that that experience in other contexts things things get complicated smart TVs also not so smart sometimes the limitation of argumentation is not fast enough what a platform fragmentation and red so huge the what is the best day I YouTube itself is still but is only able to be with tational 5 on crown all the browsers are still using flash and royalty video sites like Wikipedia can only reach about happy visitors with royalty-free the correct and it's difficulty using features were support is limited we have sort of a broken the cats on the internet the sort of we have there but how do we sort of transcend these limitations so and we will look at will that sort of embedding of player experience and and we'll then we'll look at sort of what the media API and liberty see offer in terms of new possibilities and will get to in another sort of FIL rocket pack on the at the end so the experience that who it is worthwhile to talk about this really quickly just in the sense that it a player experiences not just the on the video playback there's a bunch of other things going on in any sort of modern video playback environment there's some the simple features like thumbnail scrubbing more and more complicated pieces for sort of response of layout of text and associate content within the player there's a social sharing related videos fulfillment events lots of lots of complexity can be baked into a player in the commercial environment today but all the all advertising monetization configuration analytics configuration custom event tracking on engagement and video quizzes chapters called action playlist there's a there's a huge of swath of functionality that surrogates package around video players today M. we and that's basically part of the challenge so when when you have this idea of sort of writing it once you know I I E 8 of going back to our sort of the limitations were now faced in delivering even in the browser environment we we have to you know still sort of play least-common-denominator II 8 is still a common issue we're still out there a lot and dozens of operational applied all from it doesn't it doesn't really support modern CSS features of the bill defenses again and can be possible has slowed JavaScript engine and HOS is broken across and reversions as we've seen before I was as many restrictions on what you I also mentioned and of Firefox is not really support the new API yet so we sort of have to design an architecture that sort of abstracts out the played component enables us to sort of swap in either a Flash applet for a native of player component will where possible in order to sort of liver this platform as as broadly as possible the come so I'm betting on the way you want to sort of put it all into an I frame this sort of helps you sandbox your HTML and CSS and JavaScript that matter so that you don't have to deal with the on page of CSS a double script messing up the player we use something called a friendly I frame or same domain I frame which basically enables us to inject the content directly will look at how that works in a 2nd and avoid some of the asynchronous API issues with post message and basically enables you to sort of encapsulate all your sort of work around sort of IE fixes all year I westexas all year and ended fixes into a nice little container that has a simple embedding API so here is just a quick example of how we sort of then the I frame payload you can see we basically get the get the whole I frame and I can include any per player content that's another skin the entry data any metadata associated with that entry of a list of plug-ins that enables all that sort of package can be sort of injected into the page and we make it all part of that initial script include so we get a really nice performance that way as well because we don't have to do another request for the I frame that initial request has both the embed logic as well as the API as well as the I frame payload all with that 1st job script include and and really sort of gives you a nice combination of optimization and code isolation and then we take that same sort of logic and the embedded into native environment but in the native environment instead of the I frame having a video tag in the bottom it's going to have a native video component so basically IOS for the Android media framework exposes the video player in that context and were able to the play with that and instead of regional by API and that lets us get around a lot of the restrictions but when when the jobless that actually goes to communicate with the native components it's gonna
call the the native bridge as opposed to the it's 5 API is just some example code if you've worked with Cordova or any of the arm additional 5 packaging tools it will it'll look somewhat familiar basically just sort of sat uh you trigger a events on the parent native context by sort of opening up a new I frame and then that and allows you sort of cross communication or ideally sending messages out and to get messages down you can just change the the hashtag of the weight you there's a way you can basically I've changed the essentially the hashtag was sort of like a post message that gets passed back into the the play itself so you can have two-way communication and
basically going back to the architecture diagrams were looking at like this piece right here which is
the wireless media framework we can see my mouse but have that basically it just means you're able sort of abstract things what is this enable this this really lets you enabled the full is small size clarity I'll let business logic all those different screens all those different actions although scanning all the uh logic around analytics quantization into native environments without the additional restrictions so there's also things like uh synchronised captions or or captions that allow you know different positioning there's just any number of features that are traditionally limited when when you have to use the native controls of the device and doing it this way really opens up a lot a lot of possibilities mean obviously has the restriction that you have to packaged into a native application but once once you're in that environment but it makes a lot faster to be able cross-ship you're features across Android and IOS and it's you know it it basically lets you originated features offline counting controls normalize and replay lacked could be used for other things like a software them player if if for instance you want to play back within content and I'll ask you could you could use the same sort of framework because it would again be jobless script communicating directly with the native component not with my video tag that he when you provides you can check out these native player component projects on on get have and the on when it so getting getting going back to sort of looking at some of the other features here so it's important to keep in mind that the whole is partners that the whole is more than the sum of the parts quote I think it really applies to relational 5 standard as we sort of look at look at media source API and Web ITC and sort of see how the independently they're providing certain use cases but then they can be combined just by the nature of the molding within 5 platform
and new interesting use cases become possible for so look really quickly at at the media source API and this is just a
basic on an example
the you basically creating new media source and Ukrainian video tag and set the source to and object URL which is the media source object that you created very very straightforward and you you add a source open event and then you're able to depend a buffer and what's what's magical about it is that her magical but need is that you can append this data from many sources that you grab it so that can be an XHR request that can be if you have encoded in your browser that's generating the Web then encoded video content if in the point in the data that way if you pull the the data over a beer channel you can also conducted as well so a lot of a lot of flexibility in sort of just sequencing in video content we can see a quick sample demo
this is the simplest version of 0 where them junk append just appends 5 chance plays a back very straightforward at the full API is a
little bit more robust and enables things like I M Pei dashed if you want honest will take a look at this as well
so was are basically
just as you can see here's another gazing see very well from the back there but but it sort of low quality and then it'll adapt the stream at 10 seconds or so assuming the network is very so now you jumps jumps to higher all positive and the I and that that's that
demos just using dashed JS project which is a nice library that's been built up by the dashed consortia on makes it really easy to integrate a gas and your projects and that that was sort of a drop in into the culture player that we were talking about earlier the on Web RTC it's important keep in mind it's sort of a set of API as and not not necessarily just 1 of the the media stream get user media API is the 1 that sort of enables getting at the media stream itself that's that's sort of accessing your your camera and microphone the RTC peer connection facilitates the calling in encryption and then with management that sort of opens up the connection between 2 peers as and then the RTC data channel which which enable sort of message exchange between peers both both in terms of you know descending Jason across to the 1 and 2 like that collaborate on sort of white board or on do some basic chat system that that supported but it's also a data channel so you can
actually use our data blobs be sent between peers as well and you know so some aquatic them the questions we can think about is what can it do beyond just a video chat I mean obviously that the key use case that has been designed for and supports well is video conferencing and that's important and it's fun to be able to do that on the web but there's also sort of other other things are opened that and as we discussed in sort of the sum of the parts being able to be combined in new ways In this case we look at the data channel here you can see a sort of of equal equally simple but in order to open these connections you you basically get to data channel established and you created channel my data
stream and then it you're able to sort of handle the events of the new channel comes in you know when it when the
the other side creates what I've I've simplified a bit and it links back to the full source code if you want to collect but the basically the key the key point of this example is trying to communicate is a table to get sort of these these binary types but across the wire across
peers so that gives a lot of flexibility so here you received a binary blob and what what could you do with that binary blob so a project that we worked on a little bit with a company called purified was basically to
support the combination of that media source API with this data channel so now you're able to take those bits and you know combine in a signaling server and let people know who's missing white and past the date the wire and your ultimately able to deliver your content through a sort of a peer-to-peer network as opposed to uh directly from the issue the server some that's was kind of fun it it does not necessarily the most useful for beauty content but
perhaps a reimplementation in in the in in life can be pretty interesting there's a lot of other cool projects in the space that I would recommend
checking out the that together JS project is really cool so basically 80 tool for creating a
collaborative experience is very easily just sort of threw embedding a few lines of java scripts you can now have sort of shared a collaborative editing on whatever you happen to be working on on the web there's the
I share fast start me which is a
nice little project as well
basically enables us sending files peer-to-peer just by dragging and dropping them onto your browser and it's completely anonymous while relatively anonymous and uh without a cloud so your your files go directly to your to the person that has the hash key that's generated once you drop of I want to the browser and it's synonymous to the extent that a report listing cryptid out through the same Weber to see channel encryption
whether someone now and then PDP x are also nice little dropping dropping library for sort of doing any XHR request as they as they are on peer-to-peer requests so it's basically a mechanism to fill in you're your XHR request for large payloads through a peer-to-peer distribution if if you have large payloads of being sent and in the that's kind of an interesting space there's a lot of possibilities there's this is just a small sample of the type of projects were seen by both here and so we look forward to more interesting things happening and really up to the the web and see what what direction developers revisited take the combination of these technologies and and you know about 2 minutes early that's but basically any other items well there's a link to the slide show here I would also give a shout out to our cultural connect conference in in June sort of deals with the Open Video and video in education use cases which should be a interesting to you please see is after give us a call perfect for e-mail on yet the site a handle on everything I guess will open it up to the questions about 11 40 now the
that of this 1 over here it so it's
a good question but more common but then but the new sports 1605 across all all the role of platforms Vimeo yes yes should should yes video video is leading with based all 5 of these for you to but I guess they don't have the same and medium in that the conversations that with you to around the topic was that is very important to have that of media source API something of lower-level control over the
5 networks that when when doing adaptive streaming because they they have extra information they also run their own CDN which which of them you know this me run their own of exam no commenter academics who criteria way of I think that's a good point that video is doing and it doesn't really get innovation it actually edges affected all new player a yes always holds Paul does that use that use station over the controls that I think it's most JavaScript these different aspects of it that I want to evaluate at least it was using flash recently the Wikipedia as well that makes sense I suspect that yeah is what about the reaction and hopefully not soon yes enough and terms OK that you and any other questions comments at the the and I'm quite interested in the weather to see a part of these and she will there be 2 features and I was wondering if um encryption and 2 and the friction is something that we would be considered as strongly or in of these feature is something that we can expect quite soon because we are living in a ward where Dada gate out and and uh all their current means all communications are not encrypted or and we we be afraid of who we are talking about on on the web so the niceties uh we knew that in this feature as encryption and 2 and uh in mind yeah I think there's an interesting possibilities of basically up well it was sort of a comments last question regarding the possibility for Weber RTC for end-to-end encryption for web content delivery Yao when the question was uh what's the focus on just make it water and was to focus on make it safe right well there that the way the Web RTC standard does include encryption is part of the protocol and I think there would be the the possibility for sort of like that or on the Web
tight interface would be perfectly possible but in the in the near to
near future apart today religious SMS is still there but you could have sort of a gateway that we're not MIC you that you just to the let without any even having to install sort of extra atoms and and the I have a simple question is there any hope of all these working well we use proxies because the actual needs all open that
at work world yeah good question
so whether Weber ITC essentially have to write a and relay the relay
server no so some of the some of the if you can't make a direct peer connection through an alternate port you can write a relay server that works completely over 40 essentially but then it just get then obviously you go to your your google or your article at some intermediary that runs a signaling so like a bridge and and that you know connects out you appear so it's not direct it's not you don't have that direct connection to your thank you and the estimates so like but I mean the protocol does include a lot of tricks for getting through firewalls and they estimate about 90 % of users on the web today I would be able to support it appear connection at least that's what they were saying that he had Google Hangout so well is that's in the interval of you will work so when the well you when you are at 4 will want to leave you to work how to also you don't want to stay away too because someone just a saturated as the world leading to reason you to views so uh right no zeros of privacy aspects but there are also tools on the network user controls that there is a need to work well well when the and and a connection to work so the user will we see a few years were uh well the tricks to describe the successfully help users tools such rates as their colleagues in uh brought the monthly it's all of these a way to move along with the dual and the but restricted to a little so it cannot be used tools such rich leagues yeah and so I mean quite well you know uh you out for you I have for you can see uh it's then the uh the organization you will have a somewhere in terms which are brawl whichever in the world to do and is that will go on and you do dual websites to spend time so close to you or a LOT do result the near the Zoe's in terms uh steals the connections of also uses up to the question is about internal delivery uh 0 through if there were no reorganization all also called the end of the and you you do delivery that goes with me I think the media source API opens itself up to those sort of types of innovation or or options for delivery right like because that data can come through any sort of channel you you could potentially have an intranet plug-in that would enable sort of multicast for alive delivery or you could have the local network topology informed the media source selection algorithm in some way in know like an extension to dash JS that would not work with a sort of local network policy but it there's no you know its potential for somebody to write something like that and create a product that would do that sort of thing in these it's possible now with with that more lower-level control it's not possible was to the apple approach of just nature less than a client makes all the decisions was so I think I think that's an interesting use case that maybe didn't think of and and we moved neural that to this is the scope of the presentation when you have 2 atoms the so that is used when you said it opens the uh is a possibility of jeans for this use is lower than the global Internet to fewer blooms in roles what went witnesses it would have to be a plug-in to the browser per cent adjustment like that of an extension of model of the the dashed depending depending on internal delivery versus our network topology the adjustments based on sort of network request so there's different options the 7 possibilities and it's really up to the products created you can talk to us afterward to do we do some work in internal delivery within culture as well if you are really interested in the subject for today and because remarks maybe nobody more any questions remarks just with your hand OK or we're thank you so much for the opportunity in the few