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
アプリの "かわいい" を支えるアニメーションツールRiveについて
uetyo
0
260
実用的なGOCACHEPROG実装をするために / golang.tokyo #40
mazrean
1
270
デザイナーが Androidエンジニアに 挑戦してみた
874wokiite
0
350
JSONataを使ってみよう Step Functionsが楽しくなる実践テクニック #devio2025
dafujii
1
530
🔨 小さなビルドシステムを作る
momeemt
4
680
Amazon RDS 向けに提供されている MCP Server と仕組みを調べてみた/jawsug-okayama-2025-aurora-mcp
takahashiikki
1
110
Processing Gem ベースの、2D レトロゲームエンジンの開発
tokujiros
2
130
rage against annotate_predecessor
junk0612
0
170
テストカバレッジ100%を10年続けて得られた学びと品質
mottyzzz
2
590
今だからこそ入門する Server-Sent Events (SSE)
nearme_tech
PRO
3
170
The Past, Present, and Future of Enterprise Java
ivargrimstad
0
360
旅行プランAIエージェント開発の裏側
ippo012
2
900
Featured
See All Featured
We Have a Design System, Now What?
morganepeng
53
7.8k
Art, The Web, and Tiny UX
lynnandtonic
303
21k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
8
920
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
285
13k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
229
22k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
333
22k
How To Stay Up To Date on Web Technology
chriscoyier
790
250k
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
234
17k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
34
3.1k
Become a Pro
speakerdeck
PRO
29
5.5k
Balancing Empowerment & Direction
lara
3
620
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
9
810
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