webrtc - the wow and the how

WebRTCThe wow and the how

Sam DuttonDeveloper Advocate, Google

Ido GreenDeveloper Advocate, Google

Google Developers Live Israel

http://ido-green.appspot.com/gdl-il-list.html


getUserMedia

● Easy Easy: simpl.info/gum

● Show off ○ ASCII camera○ Webcam Toy

● AudioRecorder

● MediaRecorder

- FF Nightly, soon in Chrome

● Intro to gUM API

Google Developers Live IsraelGoogle Developers Live Israel

http://simpl.info/gum

http://idevelop.ro/ascii-camera

http://idevelop.ro/ascii-camera

http://webcamtoy.com

http://webcamtoy.com

http://webaudiodemos.appspot.com/AudioRecorder/index.html

http://webaudiodemos.appspot.com/AudioRecorder/index.html

http://simpl.info/mediarecorder/

http://simpl.info/mediarecorder/

http://html5rocks.com/en/tutorials/getusermedia/intro/

http://html5rocks.com/en/tutorials/getusermedia/intro/





RTCPeerConnection

● Peer to peer communication and file sharing○ sharefest.me○ peercdn.com

● WebRTC platforms and

applications○ Cube Slam


http://sharefest.me

http://sharefest.me

http://peercdn.com

http://peercdn.com

http://cubeslam.com/

http://cubeslam.com/





RTCDataChannel

● Communication between peers

● Audio and video

● Video chat: apprtc.appspot.com

● Codelab :bitbucket.org/webrtc/codelab


https://apprtc.appspot.com/

https://apprtc.appspot.com/

http://bitbucket.org/webrtc/codelab

http://bitbucket.org/webrtc/codelab





Encrypted Media

● EME spec

● EME demo on webmproject.org

● Web Cryptography API: w3.

org/TR/WebCryptoAPI

● Netflix tech blog post


http://dvcs.w3.org/hg/html-media/raw-file/tip/encrypted-media/encrypted-media.html

http://dvcs.w3.org/hg/html-media/raw-file/tip/encrypted-media/encrypted-media.html

http://downloads.webmproject.org/adaptive-encrypted-demo/adaptive

http://www.w3.org/TR/WebCryptoAPI/




http://techblog.netflix.com/2013/04/html5-video-at-netflix.html

http://techblog.netflix.com/2013/04/html5-video-at-netflix.html?utm_source=html5weekly&utm_medium=email

http://techblog.netflix.com/2013/04/html5-video-at-netflix.html





Media Source Extensions

● Spec: w3.org/TR/media-source

● Adaptive streaming and time

shifting:

○ HTML5 Rocks Update

○ Cool Demo

○ DASH/MSE Demo


http://www.w3.org/TR/media-source/

http://www.w3.org/TR/media-source/

http://updates.html5rocks.com/2011/11/Stream-video-using-the-MediaSource-API

http://updates.html5rocks.com/2011/11/Stream-video-using-the-MediaSource-API

http://html5-demos.appspot.com/static/media-source.html

http://html5-demos.appspot.com/static/media-source.html

http://downloads.webmproject.org/adaptive-encrypted-demo/adaptive/

http://downloads.webmproject.org/adaptive-encrypted-demo/adaptive/





VP9● An open and royalty free video compression

standard being developed by Google.

● Demo: youtu.be/hGrGwZycV-8

● Google I/O presentation

● Code summary

● wikipedia.org/wiki/VP9


http://en.wikipedia.org/wiki/Open_format

http://en.wikipedia.org/wiki/Royalty_free

http://en.wikipedia.org/wiki/Video_compression

http://en.wikipedia.org/wiki/Google

http://www.youtube.com/watch?v=hGrGwZycV-8

http://www.youtube.com/watch?v=hGrGwZycV-8

http://youtu.be/K6JshvblIcM

http://youtu.be/K6JshvblIcM

http://webmproject.org/vp9

http://webmproject.org/vp9

http://wikipedia.org/wiki/VP9

http://wikipedia.org/wiki/VP9





Resources

● This hangout on air recording

● Google I/O presentation

● WebRTC Basics

● WebRTC eBook

● http://caniuse.com/#search=getUserMedia

Google Developers Live Israel

https://developers.google.com/live/shows/708723847-2002

https://developers.google.com/live/shows/708723847-2002

http://youtu.be/p2HzZkd2A40

http://youtu.be/p2HzZkd2A40

http://html5rocks.com/en/tutorials/webrtc/basics



http://webrtcbook.com

http://webrtcbook.com

http://caniuse.com/#search=getUserMedia

http://caniuse.com/#search=getUserMedia



Thank you!






webrtc - the wow and the how

Technology