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
44
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
210
Websocket Messaging Patterns
contra
4
1.6k
Warlock : DSTM via Websockets
contra
1
120
Other Decks in Programming
See All in Programming
Amazon BedrockでサーバレスなAIお料理ボットを作成する!!
tosuri13
0
230
あなたのアプリ、ログはでてますか?あるいはログをだしてますか? (Funabashi.dev用 軽量版)
uzulla
2
130
Prolog入門
qnighy
4
1k
Scala アプリケーションのビルドを改善してデプロイ時間を 1/4 にした話 | How I improved the build of my Scala application and reduced deployment time by 4x
nomadblacky
1
180
オートマトン学習しろ / Do automata learning
makenowjust
3
130
エラーレスポンス設計から考える、0→1開発におけるGraphQLへの向き合い方
bicstone
5
1.5k
ドメイン駆動設計を実践するために必要なもの
bikisuke
4
330
Patched fetch did not work
quramy
4
410
AndroidアプリのUIバリエーションをあの手この手で確認する / Check UI variations of Android apps by various means
tkmnzm
1
200
Scala におけるコンパイラエラーとの付き合い方
chencmd
2
430
Pythonで改めて考える「クラス(class)」の使いどころ
os1ma
5
1.1k
Amazon Neptuneで始める初めてのグラフDB ー グラフDBを使う意味を考える ー
satoshi256kbyte
2
260
Featured
See All Featured
What’s in a name? Adding method to the madness
productmarketing
PRO
21
3k
Principles of Awesome APIs and How to Build Them.
keavy
125
16k
Bash Introduction
62gerente
608
210k
The Mythical Team-Month
searls
218
43k
What's new in Ruby 2.0
geeforr
340
31k
Statistics for Hackers
jakevdp
794
220k
Adopting Sorbet at Scale
ufuk
73
8.9k
Making the Leap to Tech Lead
cromwellryan
128
8.8k
Designing on Purpose - Digital PM Summit 2013
jponch
114
6.8k
Embracing the Ebb and Flow
colly
83
4.4k
YesSQL, Process and Tooling at Scale
rocio
167
14k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
43
2k
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