EdgeConf 2013 - Realtime/WebRTC Intro Talk

Video of talk and panel discussion here: http://www.youtube.com/watch?v=Al3SEbeK61s

Transcript

1. @HenrikJoreteg
   EdgeConf Realtime
   

   View Slide

2. HI!
   

   View Slide

3. andyet.com
   

   View Slide

4. View Slide

5. View Slide

6. PICTURE OF KIDS
   Talky.io
   

   View Slide

7. WebRTC
   

   View Slide

8. low-latency
   peer-to-peer
   networking
   in the browser
   

   View Slide

9. PeerCDN
   

   View Slide

10. uses data channels
    to send files to other
    current visitors
    

    View Slide

11. de-centralized
    +
    encrypted
    =
    big win for web
    

    View Slide

12. So how’s WebRTC
    coming along?
    

    View Slide

13. att.js
    (required modded chromium)
    

    View Slide

14. View Slide

15. Sweet, so we’re good?!
    

    View Slide

16. no.
    

    View Slide

17. WebRTC is pretty
    still pretty finicky
    

    View Slide

18. Setting up a video call
    between two users...
    

    View Slide

19. - prefixed methods
    - very different error types
    - strings on FF
    - error object chrome
    - neither follows spec
    - constraints (audio/video + resolution) but not in FF
    - screensharing in chrome (flag)
    - hard to detect failure type
    - requires https or fails silently
    navigator.getUserMedia
    

    View Slide

20. getUserMedia module
    

    View Slide

21. - convert stream to blob URL set as src
    - chrome set “autoplay” to true
    - FF you attach and then call `.play()`
    - You really want to be able to mirror
    and mute in one swoop.
    Attaching a media stream
    

    View Slide

22. attachMediaStream module
    

    View Slide

23. - total greenfield, not spec’ed
    - help users discover/pass data messages
    - capabilities detection
    - screensharing from chrome to FF
    fails silently (to be fair, it’s flagged)
    Signaling Server
    

    View Slide

24. signalmaster server
    

    View Slide

25. - prefixed
    - createDataChannel
    (very finicky set of options)
    - SDP hack to remove default
    upload limitation in chrome.
    - RTCPeerConnection v. mozRTCConnection
    Peer Connections
    

    View Slide

26. RTCPeerConnection module
    

    View Slide

27. - data channels not interoperable
    - single video stream per connection
    - screensharing requires other peer connection
    - stream re-broadcasting doesn’t work (well)
    - Different levels of support for TURN
    Other Challenges:
    

    View Slide

28. THERE ARE
    OTHER
    BROWSERS!
    

    View Slide

29. First time (that i know of) where
    direct-interoperability is needed
    between browsers
    

    View Slide

30. SimpleWebRTC
    var webrtc = new SimpleWebRTC({
    localVideoEl: 'localVideo',
    remoteVideosEl: 'remotesVideos',
    autoRequestMedia: true
    });
    webrtc.on('readyToCall', function () {
    webrtc.joinRoom('room name');
    });
    

    View Slide

31. PeerJS
    OpenTok
    RTCMultiConnection
    (https://www.webrtc-experiment.com)
    

    View Slide

32. Tinkerability
    

    View Slide

33. jQuery -> DOM
    socket.io -> WebSockets
    simpleWebRTC -> WebRTC
    

    View Slide

34. WebRTC needs more
    Open Web hackers
    

    View Slide

35. feedback
    file bugs
    improve APIs
    push for interoperability
    

    View Slide

36. IsWebRTCReadyYet.com
    

    View Slide

37. Real User Feedback Data From Talky
    

    View Slide

38. Let’s make the
    Open Web
    even awesomer
    with WebRTC <3
    

    View Slide

39. THANKS!
    @HenrikJoreteg, @andyet on twitter
    

    View Slide