Upgrade to Pro — share decks privately, control downloads, hide ads and more …

JSConf EU 2015 - How to grow your own Babel fish

Sponsored · SiteGround - Reliable hosting with speed, security, and support you can count on. →
Avatar for Szymon Nowak Szymon Nowak
September 25, 2015
Programming
330
0

JSConf EU 2015 - How to grow your own Babel fish

Avatar for Szymon Nowak

Szymon Nowak

September 25, 2015

More Decks by Szymon Nowak

See All by Szymon Nowak
meet.js Katowice - ES6 Promises 101
Avatar for Szymon Nowak szimek
1
240
GDG DevFest 2015 Poland - How to grow your own Babel fish
Avatar for Szymon Nowak szimek
0
70
Serving WebP images via content negotiation
Avatar for Szymon Nowak szimek
1
96

Other Decks in Programming

See All in Programming
ここ半年くらいでAIに作らせたR用ツール
Avatar for eitsupi eitsupi
0
400
AIに既存システムを理解させる技術　～レガシーを見捨てないハーネスエンジニアリング入門～
Avatar for Ochtum ochtum
0
140
tsc.rip を支える技術 / Kyoto.なんか #8
Avatar for Susisu susisu
0
120
Cloudflare is Agents
Avatar for chimame chimame
0
180
in-process GraphQL のすすめ #ginzajs
Avatar for izumin5210 izumin5210
4
1.4k
生成AI導入の「期待外れ」を乗り越える ー 開発フロー改革が目指す、真の組織変革
Avatar for starfish719 starfish719
0
5.1k
まだ間に合う！今年の夏こそSchemeのマクロ展開器を完全理解！
Avatar for Masanori Ogino omasanori
0
380
VibeCodingからAgenticWorkflowへ
Avatar for starfish719 starfish719
0
770
使いながら育てる Claude Code — 開発フローの1コマンド化 × 繰り返し指摘の自動仕組み化
Avatar for endo shiki shiki_kakaku
0
1.9k
引き算の組織 ― アウトカムとAIに全振りするために辞めたこと ― / Organization by Subtraction
Avatar for ヤマモトヒロキ hirokiyamamoto14
PRO
0
280
メールのエイリアス機能を履き違えない
Avatar for 船長（せんちょう） isshinfunada
0
250
言葉の格闘技のススメ～紙とペンと言葉から始める、キャリアの描き方～
Avatar for 進捗ゼミ progresscicada
2
170

Featured

See All Featured
We Analyzed 250 Million AI Search Results: Here's What I Found
Avatar for Josh Blyskal joshbly
1
1.8k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
Avatar for mongodb mongodb
49
10k
Practical Orchestrator
Avatar for Shlomi Noach shlominoach
191
12k
Introduction to Domain-Driven Design and Collaborative software design
Avatar for Kenny Baas-Schwegler baasie
1
950
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
Avatar for Rebecca Miller-Webster rmw
35
3.8k
How To Stay Up To Date on Web Technology
Avatar for Chris Coyier chriscoyier
790
250k
Optimising Largest Contentful Paint
Avatar for Harry Roberts csswizardry
37
3.9k
The Director’s Chair: Orchestrating AI for Truly Effective Learning
Avatar for Mike Taylor tmiket
1
280
Marketing Yourself as an Engineer | Alaka | Gurzu
Avatar for Gurzu gurzu
0
280
Chasing Engaging Ingredients in Design
Avatar for Sebastian Deterding codingconduct
0
280
Believing is Seeing
Avatar for Spiro Bolos oripsolob
1
200
Winning Ecommerce Organic Search in an AI Era - #searchnstuff2025
Avatar for Aleyda Solis aleyda
1
2.1k

Transcript

  1. None
  2. None

  3. WEBRTC

  4. demo

  5. None
  6. None
  7. None

  8. WORKS IN A BROWSER

  9. USES OPEN STANDARDS

  10. TOOK ONE DAY TO WRITE

  11. None

  12. HOW DOES IT WORK?

  13. 1. SENDS AUDIO AND VIDEO USING WEBRTC

  14. webrtc = new SimpleWebRTC({ localVideoEl: 'localVideo', remoteVideosEl: 'remoteVideos', autoRequestMedia: true

    }) webrtc.on('readyToCall', () => { webrtc.joinRoom('your awesome room name') })

  15. webrtc = new SimpleWebRTC({ localVideoEl: 'localVideo', remoteVideosEl: 'remoteVideos', autoRequestMedia: true

    }) webrtc.on('readyToCall', () => { webrtc.joinRoom('your awesome room name') })

  16. webrtc = new SimpleWebRTC({ localVideoEl: 'localVideo', remoteVideosEl: 'remoteVideos', autoRequestMedia: true

    }) webrtc.on('readyToCall', () => { webrtc.joinRoom('your awesome room name') })

  17. webrtc = new SimpleWebRTC({ localVideoEl: 'localVideo', remoteVideosEl: 'remoteVideos', autoRequestMedia: true

    }) webrtc.on('readyToCall', () => { webrtc.joinRoom('your awesome room name') })

  18. webrtc = new SimpleWebRTC({ localVideoEl: 'localVideo', remoteVideosEl: 'remoteVideos', autoRequestMedia: true

    }) webrtc.on('readyToCall', () => { webrtc.joinRoom('your awesome room name') })

  19. 2. RECOGNIZES WHAT YOU SAY USING WEB SPEECH

  20. recognition = new SpeechRecognition() recognition.on('result', (result) => { // do

    something with the result }) recognition.start()

  21. recognition = new SpeechRecognition() recognition.on('result', (result) => { // do

    something with the result }) recognition.start()

  22. recognition = new SpeechRecognition() recognition.on('result', (result) => { // do

    something with the result }) recognition.start()

  23. 3. SENDS TRANSCRIPT TO GOOGLE TRANSLATE

  24. 4. SENDS TRANSLATION TO THE OTHER PERSON USING WEBRTC

  25. webrtc.sendDirectlyToAll( 'channel label', 'payload label', payload )

  26. 5. READS IT OUT LOUD USING WEB SPEECH

  27. msg = new SpeechSynthesisUtterance() msg.lang = 'en-GB' msg.text = 'German

    jokes are the wurst!' speechSynthesis.speak(msg)

  28. msg = new SpeechSynthesisUtterance() msg.lang = 'en-GB' msg.text = 'German

    jokes are the wurst!' speechSynthesis.speak(msg)

  29. WEB SPEECH API INTRO

  30. ONE-SHOT CONTINUOUS

  31. SERVER CLIENT

  32. None

  33. WEB SPEECH API RANT

  34. 1. STOPS IF YOU TALK FOR TOO LONG

  35. 2. STOPS IF YOU DON’T TALK FOR TOO LONG

  36. 3. DOESN’T WORK WITH WEBRTC MEDIA STREAMS

  37. recognition = new SpeechRecognition()

  38. recognition = new SpeechRecognition(audioStream)

  39. 4. WORKS ONLY IN CHROME* * DESKTOP CHROME (crbug.com/427567)

  40. None

  41. GOOGLE NOW BY GOOGLE

  42. CORTANA BY MICROSOFT

  43. SIRI BY APPLE

  44. FIREFOX POWERED BY POCKET SPHINX

  45. None

  46. WE DON’T NEED TO WAIT FOR BROWSER VENDORS

  47. recognition = new window.SpeechRecognition(audioStream)

  48. recognition = new window.SpeechRecognition(audioStream)

  49. recognition = new acme.SpeechRecognition(audioStream)

  50. FACEBOOK M BY FACEBOOK

  51. HOUND BY SOUNDHOUND

  52. DUER BY BAIDU

  53. DRAGON BY NUANCE

  54. IBM WATSON BY IBM

  55. POCKETSPHINX.JS BY SYLVAIN CHEVALIER

  56. WEBRTC-TRANSLATE.HEROKUAPP.COM GITHUB.COM/SZIMEK/WEBRTC-TRANSLATE DEMO: CODE:

  57. SZYMON NOWAK @SZIMEK COWBELL LABS FREELETICS we’re hiring!

  58. THANK YOU