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
orange — Client side concurrency made simple
Search
Florian Plank
October 17, 2013
Programming
0
130
orange — Client side concurrency made simple
Florian Plank
October 17, 2013
Tweet
Share
More Decks by Florian Plank
See All by Florian Plank
Ready, set, immersion!
polarblau
0
160
Prototyping all the things
polarblau
2
150
CoffeeScript vs. ECMAScript 6
polarblau
5
3.4k
Design for a complex Reality — Siili Breakfast Edition
polarblau
0
120
Enabling Design for a Complex Reality
polarblau
2
120
A primer on Content Security Policy
polarblau
1
360
Rails and the future of the open web
polarblau
3
110
Brief Ruby/Ruby on Rails intro
polarblau
3
160
Ruby Idioms
polarblau
3
550
Other Decks in Programming
See All in Programming
menu基盤チームによるGoogle Cloudの活用事例~Application Integration, Cloud Tasks編~
yoshifumi_ishikura
0
110
Mermaid x AST x 生成AI = コードとドキュメントの完全同期への道
shibuyamizuho
0
160
短期間での新規プロダクト開発における「コスパの良い」Goのテスト戦略」 / kamakura.go
n3xem
2
170
創造的活動から切り拓く新たなキャリア 好きから始めてみる夜勤オペレーターからSREへの転身
yjszk
1
130
[JAWS-UG横浜 #76] イケてるアップデートを宇宙いち早く紹介するよ!
maroon1st
0
460
SymfonyCon Vienna 2025: Twig, still relevant in 2025?
fabpot
3
1.2k
バグを見つけた?それAppleに直してもらおう!
uetyo
0
180
急成長期の品質とスピードを両立するフロントエンド技術基盤
soarteclab
0
930
「Chatwork」Android版アプリを 支える単体テストの現在
okuzawats
0
180
プロダクトの品質に コミットする / Commit to Product Quality
pekepek
2
770
Fibonacci Function Gallery - Part 1
philipschwarz
PRO
0
210
採用事例の少ないSvelteを選んだ理由と それを正解にするためにやっていること
oekazuma
2
1k
Featured
See All Featured
Writing Fast Ruby
sferik
628
61k
How To Stay Up To Date on Web Technology
chriscoyier
789
250k
Designing for Performance
lara
604
68k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
95
17k
Navigating Team Friction
lara
183
15k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
28
2.1k
Docker and Python
trallard
42
3.1k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
6
510
Measuring & Analyzing Core Web Vitals
bluesmoon
4
170
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
507
140k
Statistics for Hackers
jakevdp
796
220k
Building Flexible Design Systems
yeseniaperezcruz
327
38k
Transcript
orange — Client side concurrency made simple
rubysauna.org
heartrate.js
None
None
None
None
Concurrency
A B C
A B C
A B C
Concurrency is hard
A B C
Concurrency
Barber z z
Barber Customer z z Sleeping?
Barber Customer
Barber Customer Working?
Barber Customer
Barber
Barber Customer
Barber
Barber Customer ?
Barber Customer Crap.
Barber
Barber Customer
Barber z z Crap.
Concurrency in the browser
JavaScript and the golden thread
None
None
None
foo() 10ms 20ms 30ms 40ms click handled click fired setInterval
(10ms)
None
Synchronous —vs— Asynchronous
WebWorkers
JavaScript Thread Worker
Worker JavaScript Thread
Worker Worker JavaScript Thread
Dedicated, Shared & Inline Workers
None
orange
The queue
Define a worker
# workers/sum.coffee importScripts 'orange/worker.js' perform (data)-> data.numbers.reduce (a, b)-> a
+ b
# workers/sum.coffee importScripts 'orange/worker.js' perform (data)-> data.numbers.reduce (a, b)-> a
+ b
Create a new job
job = new Orange.Job('sum', numbers: [1..100])
job = new Orange.Job('sum', numbers: [1..100]) job.on 'success', (response) ->
console.log('Sum', response) job.perform()
Events
job.on 'success', (response)-> job.on 'complete', -> job.on 'error', (error)-> job.on
'failure', (error)->
Logging
# workers/sum.coffee importScripts 'orange/worker.js' perform (data)-> log 'The background worker
Gotham deserves ...' data.numbers.reduce (a, b) ->a + b
Batches
batch = new Orange.Batch
batch = new Orange.Batch job = new Orange.Job('sum', [1..100]) batch.push
job batch.perform()
batch = new Orange.Batch [job1, job2, job3]
batch.on 'complete', (jobs) -> batch.on 'job:success', (job) -> batch.on 'job:complete',
(job)-> batch.on 'job:error', (job) -> batch.on 'job:failure', (job) ->
job.getResponse() job.getLastError()
Configuration
Orange.Config.set maxWorkerPoolSize: 4 maxRetries : 3 workersPath : '/lib/workers/'
Retry mechanism and exponential back–off
Error handling
job.on 'error', (error)-> throw error BatchStateTransitionError JobStateTransitionError ResponderNotFoundError …
None
Roadmap >0.2.0
Customized Worker Shim Test coverage Data serialization Benchmarking
Forward arbitrary method calls to worker? Custom events? Instrumentation? Inline
Workers? Helper modules?
Kiitos!
@polarblau