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
JSConf EU 2015 - How to grow your own Babel fish
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
Szymon Nowak
September 25, 2015
Programming
0
330
JSConf EU 2015 - How to grow your own Babel fish
Szymon Nowak
September 25, 2015
Tweet
Share
More Decks by Szymon Nowak
See All by Szymon Nowak
meet.js Katowice - ES6 Promises 101
szimek
1
230
GDG DevFest 2015 Poland - How to grow your own Babel fish
szimek
0
65
Serving WebP images via content negotiation
szimek
1
91
Other Decks in Programming
See All in Programming
最初からAWS CDKで技術検証してもいいんじゃない?
akihisaikeda
4
170
CS教育のDX AIによる育成の効率化
niftycorp
PRO
0
160
AI Assistants for Your Angular Solutions
manfredsteyer
PRO
0
160
我々はなぜ「層」を分けるのか〜「関心の分離」と「抽象化」で手に入れる変更に強いシンプルな設計〜 #phperkaigi / PHPerKaigi 2026
shogogg
2
350
Redox OS でのネームスペース管理と chroot の実現
isanethen
0
420
RailsのValidatesをSwift Macrosで再現してみた
hokuron
0
110
Reactive ❤️ Loom: A Forbidden Love Story
franz1981
2
150
へんな働き方
yusukebe
5
2.8k
条件判定に名前、つけてますか? #phperkaigi #c
77web
2
780
Kubernetesでセルフホストが簡単なNewSQLを求めて / Seeking a NewSQL Database That's Simple to Self-Host on Kubernetes
nnaka2992
0
180
Migration to Signals, Signal Forms, Resource API, and NgRx Signal Store @Angular Days 03/2026 Munich
manfredsteyer
PRO
0
140
DevinとClaude Code、SREの現場で使い倒してみた件
karia
1
1.1k
Featured
See All Featured
Building a A Zero-Code AI SEO Workflow
portentint
PRO
0
410
The World Runs on Bad Software
bkeepers
PRO
72
12k
Joys of Absence: A Defence of Solitary Play
codingconduct
1
320
Accessibility Awareness
sabderemane
0
84
Site-Speed That Sticks
csswizardry
13
1.1k
The Curse of the Amulet
leimatthew05
1
10k
Lightning Talk: Beautiful Slides for Beginners
inesmontani
PRO
1
490
Optimizing for Happiness
mojombo
378
71k
Stewardship and Sustainability of Urban and Community Forests
pwiseman
0
160
The B2B funnel & how to create a winning content strategy
katarinadahlin
PRO
1
310
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
35
3.4k
Imperfection Machines: The Place of Print at Facebook
scottboms
269
14k
Transcript
None
None
WEBRTC
demo
None
None
None
WORKS IN A BROWSER
USES OPEN STANDARDS
TOOK ONE DAY TO WRITE
None
HOW DOES IT WORK?
1. SENDS AUDIO AND VIDEO USING WEBRTC
webrtc = new SimpleWebRTC({ localVideoEl: 'localVideo', remoteVideosEl: 'remoteVideos', autoRequestMedia: true
}) webrtc.on('readyToCall', () => { webrtc.joinRoom('your awesome room name') })
webrtc = new SimpleWebRTC({ localVideoEl: 'localVideo', remoteVideosEl: 'remoteVideos', autoRequestMedia: true
}) webrtc.on('readyToCall', () => { webrtc.joinRoom('your awesome room name') })
webrtc = new SimpleWebRTC({ localVideoEl: 'localVideo', remoteVideosEl: 'remoteVideos', autoRequestMedia: true
}) webrtc.on('readyToCall', () => { webrtc.joinRoom('your awesome room name') })
webrtc = new SimpleWebRTC({ localVideoEl: 'localVideo', remoteVideosEl: 'remoteVideos', autoRequestMedia: true
}) webrtc.on('readyToCall', () => { webrtc.joinRoom('your awesome room name') })
webrtc = new SimpleWebRTC({ localVideoEl: 'localVideo', remoteVideosEl: 'remoteVideos', autoRequestMedia: true
}) webrtc.on('readyToCall', () => { webrtc.joinRoom('your awesome room name') })
2. RECOGNIZES WHAT YOU SAY USING WEB SPEECH
recognition = new SpeechRecognition() recognition.on('result', (result) => { // do
something with the result }) recognition.start()
recognition = new SpeechRecognition() recognition.on('result', (result) => { // do
something with the result }) recognition.start()
recognition = new SpeechRecognition() recognition.on('result', (result) => { // do
something with the result }) recognition.start()
3. SENDS TRANSCRIPT TO GOOGLE TRANSLATE
4. SENDS TRANSLATION TO THE OTHER PERSON USING WEBRTC
webrtc.sendDirectlyToAll( 'channel label', 'payload label', payload )
5. READS IT OUT LOUD USING WEB SPEECH
msg = new SpeechSynthesisUtterance() msg.lang = 'en-GB' msg.text = 'German
jokes are the wurst!' speechSynthesis.speak(msg)
msg = new SpeechSynthesisUtterance() msg.lang = 'en-GB' msg.text = 'German
jokes are the wurst!' speechSynthesis.speak(msg)
WEB SPEECH API INTRO
ONE-SHOT CONTINUOUS
SERVER CLIENT
None
WEB SPEECH API RANT
1. STOPS IF YOU TALK FOR TOO LONG
2. STOPS IF YOU DON’T TALK FOR TOO LONG
3. DOESN’T WORK WITH WEBRTC MEDIA STREAMS
recognition = new SpeechRecognition()
recognition = new SpeechRecognition(audioStream)
4. WORKS ONLY IN CHROME* * DESKTOP CHROME (crbug.com/427567)
None
GOOGLE NOW BY GOOGLE
CORTANA BY MICROSOFT
SIRI BY APPLE
FIREFOX POWERED BY POCKET SPHINX
None
WE DON’T NEED TO WAIT FOR BROWSER VENDORS
recognition = new window.SpeechRecognition(audioStream)
recognition = new window.SpeechRecognition(audioStream)
recognition = new acme.SpeechRecognition(audioStream)
FACEBOOK M BY FACEBOOK
HOUND BY SOUNDHOUND
DUER BY BAIDU
DRAGON BY NUANCE
IBM WATSON BY IBM
POCKETSPHINX.JS BY SYLVAIN CHEVALIER
WEBRTC-TRANSLATE.HEROKUAPP.COM GITHUB.COM/SZIMEK/WEBRTC-TRANSLATE DEMO: CODE:
SZYMON NOWAK @SZIMEK COWBELL LABS FREELETICS we’re hiring!
THANK YOU