Lock in $30 Savings on PRO—Offer Ends Soon! ⏳
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
150
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
180
Prototyping all the things
polarblau
2
180
CoffeeScript vs. ECMAScript 6
polarblau
5
3.5k
Design for a complex Reality — Siili Breakfast Edition
polarblau
0
150
Enabling Design for a Complex Reality
polarblau
2
130
A primer on Content Security Policy
polarblau
1
430
Rails and the future of the open web
polarblau
3
130
Brief Ruby/Ruby on Rails intro
polarblau
3
190
Ruby Idioms
polarblau
3
590
Other Decks in Programming
See All in Programming
Why Kotlin? 電子カルテを Kotlin で開発する理由 / Why Kotlin? at Henry
agatan
2
6.1k
Google Antigravity and Vibe Coding: Agentic Development Guide
mickey_kubo
2
130
モダンJSフレームワークのビルドプロセス 〜なぜReactは503行、Svelteは12行なのか〜
fuuki12
0
180
WebRTC、 綺麗に見るか滑らかに見るか
sublimer
1
140
著者と進める!『AIと個人開発したくなったらまずCursorで要件定義だ!』
yasunacoffee
0
110
レイトレZ世代に捧ぐ、今からレイトレを始めるための小径
ichi_raven
0
490
モデル駆動設計をやってみよう Modeling Forum2025ワークショップ/Let’s Try Model-Driven Design
haru860
0
230
AIコーディングエージェント(Gemini)
kondai24
0
120
MAP, Jigsaw, Code Golf 振り返り会 by 関東Kaggler会|Jigsaw 15th Solution
hasibirok0
0
210
TypeScriptで設計する 堅牢さとUXを両立した非同期ワークフローの実現
moeka__c
6
2.9k
All(?) About Point Sets
hole
0
260
大体よく分かるscala.collection.immutable.HashMap ~ Compressed Hash-Array Mapped Prefix-tree (CHAMP) ~
matsu_chara
1
210
Featured
See All Featured
A Modern Web Designer's Workflow
chriscoyier
697
190k
Why You Should Never Use an ORM
jnunemaker
PRO
60
9.6k
Why Our Code Smells
bkeepers
PRO
340
57k
We Have a Design System, Now What?
morganepeng
54
7.9k
Product Roadmaps are Hard
iamctodd
PRO
55
12k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
128
54k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
34
2.5k
Visualization
eitanlees
150
16k
Practical Orchestrator
shlominoach
190
11k
The Pragmatic Product Professional
lauravandoore
37
7k
The World Runs on Bad Software
bkeepers
PRO
72
12k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
35
3.3k
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