Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Real World WebRTC
Search
Eric Schoffstall
March 02, 2016
Programming
0
48
Real World WebRTC
Given at dot.js in Paris, 2015
Eric Schoffstall
March 02, 2016
Tweet
Share
More Decks by Eric Schoffstall
See All by Eric Schoffstall
CoffeeScript 101
contra
3
220
Websocket Messaging Patterns
contra
4
1.6k
Warlock : DSTM via Websockets
contra
1
130
Other Decks in Programming
See All in Programming
iOSでSVG画像を扱う
kishikawakatsumi
0
170
Devoxx BE - Local Development in the AI Era
kdubois
0
140
contribution to astral-sh/uv
shunsock
0
540
The Past, Present, and Future of Enterprise Java
ivargrimstad
0
470
Catch Up: Go Style Guide Update
andpad
0
250
Foundation Modelsを実装日本語学習アプリを作ってみた!
hypebeans
1
130
スキーマ駆動で、Zod OpenAPI Honoによる、API開発するために、Hono Takibiというライブラリを作っている
nakita628
0
320
Claude CodeによるAI駆動開発の実践 〜そこから見えてきたこれからのプログラミング〜
iriikeita
0
330
What's new in Spring Modulith?
olivergierke
1
170
Cursorハンズオン実践!
eltociear
2
1.2k
GC25 Recap: The Code You Reviewed is Not the Code You Built / #newt_gophercon_tour
mazrean
0
110
品質ワークショップをやってみた
nealle
0
630
Featured
See All Featured
Building Flexible Design Systems
yeseniaperezcruz
329
39k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
333
22k
How GitHub (no longer) Works
holman
315
140k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
32
1.7k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
127
54k
Making Projects Easy
brettharned
120
6.4k
Keith and Marios Guide to Fast Websites
keithpitt
411
23k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
16k
Facilitating Awesome Meetings
lara
57
6.6k
A designer walks into a library…
pauljervisheath
209
24k
Producing Creativity
orderedlist
PRO
347
40k
It's Worth the Effort
3n
187
28k
Transcript
Real World WebRTC
WebRTC
WebRTC is rad
WebRTC is cheap
WebRTC is cutting-edge
WebRTC is difficult
WebRTC is difficult Adapters? Plugins? Polyfills? Native? Prefixes? Extensions?
High Level
Camera Access
navigator.getUserMedia
var opt = {video: true}; navigator.getUserMedia(opt, onSuccess, onError);
var opt = {video: true, audio: true}; navigator.getUserMedia(opt, onSuccess, onError);
getUserMedia(opt, onSuccess, onError);
element.srcObject = stream;
codepen.io/contra/full/eyjgf (PLEASE MUTE)
P2P
PeerConnection
PeerConnection - Offer var pc = new PeerConnection(); pc.addStream(stream); pc.createOffer(function(offer)
{ var sdp = new SessionDescription(offer); pc.setLocalDescription(sdp, function() { // TODO: send to other user }); });
PeerConnection - Answer var pc = new PeerConnection(); pc.addStream(stream); var
offer = new SessionDescription(msg); pc.setRemoteDescription(offer, function() { pc.createAnswer(function(answer) { var sdp = new SessionDescription(answer); pc.setLocalDescription(sdp, function() { // TODO: send to other user }); }); });
DataChannel
DataChannel var dataChannel = pc.createDataChannel('cool-stuff'); dataChannel.onopen = function() { dataChannel.send('yo
sup'); };
DataChannel TCP UDP SCTP Reliability reliable unreliable configurable Delivery ordered
unordered configurable Transmission byte-oriented message-oriented message-oriented Flow Control yes no yes
Making a Real Product
Initial Prototype
"Oops" Realization
Do we need to?
Do we need to? YES
Android
Android <3 Crosswalk
iOS
iOS <3 iosrtc
iOS <3 iosrtc
IE/Safari
IE/Safari <3 Temasys
RTC Everywhere
http://rtc.works
http://rtc.works Chrom e Firefox Safari IE Android Edge iOS Node.js
None
None
None
None
None