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
47
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
技術的負債で信頼性が限界だったWordPress運用をShifterで完全復活させた話
rvirus0817
0
320
Vibe Codingの幻想を超えて-生成AIを現場で使えるようにするまでの泥臭い話.ai
fumiyakume
21
10k
書き捨てではなく継続開発可能なコードをAIコーディングエージェントで書くために意識していること
shuyakinjo
0
210
マイコンでもRustのtestがしたい その2/KernelVM Tokyo 18
tnishinaga
0
280
GUI操作LLMの最新動向: UI-TARSと関連論文紹介
kfujikawa
0
530
No Install CMS戦略 〜 5年先を見据えたフロントエンド開発を考える / no_install_cms
rdlabo
0
440
Android 15以上でPDFのテキスト検索を爆速開発!
tonionagauzzi
0
190
ZeroETLで始めるDynamoDBとS3の連携
afooooil
0
150
変化を楽しむエンジニアリング ~ いままでとこれから ~
murajun1978
0
670
あのころの iPod を どうにか再生させたい
orumin
2
470
kiroでゲームを作ってみた
iriikeita
0
140
Vibe coding コードレビュー
kinopeee
0
410
Featured
See All Featured
Understanding Cognitive Biases in Performance Measurement
bluesmoon
29
1.8k
Making Projects Easy
brettharned
117
6.3k
The Invisible Side of Design
smashingmag
301
51k
The Power of CSS Pseudo Elements
geoffreycrofte
77
5.9k
Rebuilding a faster, lazier Slack
samanthasiow
83
9.1k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
16k
How to Think Like a Performance Engineer
csswizardry
25
1.8k
No one is an island. Learnings from fostering a developers community.
thoeni
21
3.4k
The Cult of Friendly URLs
andyhume
79
6.5k
Scaling GitHub
holman
461
140k
Thoughts on Productivity
jonyablonski
69
4.8k
Typedesign – Prime Four
hannesfritz
42
2.7k
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