Slide 1

Slide 1 text

@HenrikJoreteg EdgeConf Realtime

Slide 2

Slide 2 text

HI!

Slide 3

Slide 3 text

andyet.com

Slide 4

Slide 4 text

No content

Slide 5

Slide 5 text

No content

Slide 6

Slide 6 text

PICTURE OF KIDS Talky.io

Slide 7

Slide 7 text

WebRTC

Slide 8

Slide 8 text

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

Slide 9

Slide 9 text

PeerCDN

Slide 10

Slide 10 text

uses data channels to send files to other current visitors

Slide 11

Slide 11 text

de-centralized + encrypted = big win for web

Slide 12

Slide 12 text

So how’s WebRTC coming along?

Slide 13

Slide 13 text

att.js (required modded chromium)

Slide 14

Slide 14 text

No content

Slide 15

Slide 15 text

Sweet, so we’re good?!

Slide 16

Slide 16 text

no.

Slide 17

Slide 17 text

WebRTC is pretty still pretty finicky

Slide 18

Slide 18 text

Setting up a video call between two users...

Slide 19

Slide 19 text

- 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

Slide 20

Slide 20 text

getUserMedia module

Slide 21

Slide 21 text

- 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

Slide 22

Slide 22 text

attachMediaStream module

Slide 23

Slide 23 text

- 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

Slide 24

Slide 24 text

signalmaster server

Slide 25

Slide 25 text

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

Slide 26

Slide 26 text

RTCPeerConnection module

Slide 27

Slide 27 text

- 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:

Slide 28

Slide 28 text

THERE ARE OTHER BROWSERS!

Slide 29

Slide 29 text

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

Slide 30

Slide 30 text

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

Slide 31

Slide 31 text

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

Slide 32

Slide 32 text

Tinkerability

Slide 33

Slide 33 text

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

Slide 34

Slide 34 text

WebRTC needs more Open Web hackers

Slide 35

Slide 35 text

feedback file bugs improve APIs push for interoperability

Slide 36

Slide 36 text

IsWebRTCReadyYet.com

Slide 37

Slide 37 text

Real User Feedback Data From Talky

Slide 38

Slide 38 text

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

Slide 39

Slide 39 text

THANKS! @HenrikJoreteg, @andyet on twitter