Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Speaker Deck
PRO
Sign in
Sign up for free
ember-concurrency: an experience report
Reg Braithwaite
June 05, 2017
Programming
1
86
ember-concurrency: an experience report
An informal talk given at the EmberTO meetup in June, 2017
Reg Braithwaite
June 05, 2017
Tweet
Share
More Decks by Reg Braithwaite
See All by Reg Braithwaite
Courage
raganwald
0
85
Waste in Software Development
raganwald
0
130
First-Class Commands, the 2017 Edition
raganwald
1
140
Optimism and the Growth Mindset
raganwald
0
180
Optimism II
raganwald
0
260
Optimism
raganwald
0
1.6k
First-Class Commands: an unexpectedly fertile design pattern
raganwald
4
2.4k
JavaScript Combinators, the “six” edition
raganwald
8
1.1k
Duck Typing, Compatibility, and the Adaptor Pattern
raganwald
7
10k
Other Decks in Programming
See All in Programming
コードの解析と言語習得の心得
jinjin33333
0
130
あなたの会社の古いシステム、なんとかしませんか?~システム刷新から考えるDX化への道筋とバリエーション~/webinar20220420-grapecity
grapecity_dev
0
130
Enterprise Angular: Frontend Moduliths with Nx and Standalone Components @jax2022
manfredsteyer
PRO
0
290
You CANt teach an old dog new tricks
michaelbukachi
0
110
TDX22: User-Mode DB Ops
ca_peterson
3
1.1k
Securing Kafka Connect Pipelines with Client-Side Field Level Cryptography @ Kafka Summit London 2022
hpgrahsl
0
310
Let's make a contract: the art of designing a Java API
mariofusco
0
160
Explore Java 17 and beyond
josepaumard
3
640
プログラミングを勉強したいと言われたら
yuba_4
0
380
Reinventing the wheel ... as a service
mariofusco
3
240
About Type Syntax Proposal
quramy
1
990
SPA/MPA 議論の俯瞰と 現代における設計のポイント - #tfcon 2022 フロントエンド設計
ahomu
3
1.6k
Featured
See All Featured
We Have a Design System, Now What?
morganepeng
35
2.9k
Designing for humans not robots
tammielis
241
23k
How To Stay Up To Date on Web Technology
chriscoyier
780
250k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
349
27k
A Tale of Four Properties
chriscoyier
149
20k
Creatively Recalculating Your Daily Design Routine
revolveconf
205
10k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
268
11k
Principles of Awesome APIs and How to Build Them.
keavy
113
15k
StorybookのUI Testing Handbookを読んだ
zakiyama
4
2k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
151
12k
No one is an island. Learnings from fostering a developers community.
thoeni
9
1.1k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
119
28k
Transcript
ember-concurrency "an experience report" Reginald @raganwald Braithwaite, PagerDuty Inc.
ember-concurrency ember-concurrency is an Ember Addon that makes it easy
to write concise, robust, and beautiful asynchronous code. --http://ember-concurrency.com/ Reginald @raganwald Braithwaite, PagerDuty Inc.
tasks and instances aTask = task(function * () { const
{ geolocation, store } = this.get(...); const coords = yield geolocation.getCoords(); const result = yield store.getNearbyStores(coords); this.set('result', result); }); anInstance = someTask.perform(); Reginald @raganwald Braithwaite, PagerDuty Inc.
problems ember-concurrency solves, easily Reginald @raganwald Braithwaite, PagerDuty Inc.
mashing the "submit" button on an update Reginald @raganwald Braithwaite,
PagerDuty Inc.
! Reginald @raganwald Braithwaite, PagerDuty Inc.
concurrency protocols task(function * () { // ... }).drop() (ember-concurrency
calls these "modifiers") Reginald @raganwald Braithwaite, PagerDuty Inc.
! Reginald @raganwald Braithwaite, PagerDuty Inc.
displaying a loading spinner Reginald @raganwald Braithwaite, PagerDuty Inc.
! this.set('isLoading', true); this.xhr = fetch(id).then( success => { this.set('isLoading',
false); // ... }, failure => { this.set('isLoading', false); // ... }); Reginald @raganwald Braithwaite, PagerDuty Inc.
! isLoading: reads('fetchTask.isRunning') Reginald @raganwald Braithwaite, PagerDuty Inc.
using ember-concurrency to solve other problems Reginald @raganwald Braithwaite, PagerDuty
Inc.
chunking updates to our api Reginald @raganwald Braithwaite, PagerDuty Inc.
progress const chunks = _.chunk(incidents, CHUNK_SIZE); let done = 0;
this.set('done', done); for (const theseIncidents of chunks) { yield this.resolve(theseIncidents); done = done + theseIncidents.length); this.set('done', done); } Reginald @raganwald Braithwaite, PagerDuty Inc.
Reginald @raganwald Braithwaite, PagerDuty Inc.
cancellation aTask.cancelAll(); anInstance.cancel(); Reginald @raganwald Braithwaite, PagerDuty Inc.
a bigger challenge Reginald @raganwald Braithwaite, PagerDuty Inc.
In JavaScript, AJAX requests happen concurrently. Reginald @raganwald Braithwaite, PagerDuty
Inc.
Reginald @raganwald Braithwaite, PagerDuty Inc.
⛈ websocket ping: [-----------------] submit update: [-----------] Reginald @raganwald Braithwaite,
PagerDuty Inc.
☀ Reginald @raganwald Braithwaite, PagerDuty Inc.
sharing one task task(function * (promissoryThunk) { let result; yield
promissoryThunk().then(value => { result = value; }); return result; }).enqueue() Reginald @raganwald Braithwaite, PagerDuty Inc.
serialized results websocket ping: [--------] submit update: [-------] Reginald @raganwald
Braithwaite, PagerDuty Inc.
⁉ Reginald @raganwald Braithwaite, PagerDuty Inc.
task groups tasks: taskGroup().enqueue(), handlePing: task(function * () { //
... }).group('tasks'), submitUpdate: task(function * () { // ... }).group('tasks') Reginald @raganwald Braithwaite, PagerDuty Inc.
ember-concurrency conclusion Reginald @raganwald Braithwaite, PagerDuty Inc.
Simple things are easy, complex things are possible. Reginald @raganwald
Braithwaite, PagerDuty Inc.
Reginald @raganwald Braithwaite, PagerDuty Inc.