$30 off During Our Annual Pro Sale. View Details »

ember-concurrency: an experience report

ember-concurrency: an experience report

An informal talk given at the EmberTO meetup in June, 2017

Reg Braithwaite

June 05, 2017
Tweet

More Decks by Reg Braithwaite

Other Decks in Programming

Transcript

  1. ember-concurrency "an experience report" Reginald @raganwald Braithwaite, PagerDuty Inc.

  2. 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.
  3. 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.
  4. problems ember-concurrency solves, easily Reginald @raganwald Braithwaite, PagerDuty Inc.

  5. mashing the "submit" button on an update Reginald @raganwald Braithwaite,

    PagerDuty Inc.
  6. ! Reginald @raganwald Braithwaite, PagerDuty Inc.

  7. concurrency protocols task(function * () { // ... }).drop() (ember-concurrency

    calls these "modifiers") Reginald @raganwald Braithwaite, PagerDuty Inc.
  8. ! Reginald @raganwald Braithwaite, PagerDuty Inc.

  9. displaying a loading spinner Reginald @raganwald Braithwaite, PagerDuty Inc.

  10. ! this.set('isLoading', true); this.xhr = fetch(id).then( success => { this.set('isLoading',

    false); // ... }, failure => { this.set('isLoading', false); // ... }); Reginald @raganwald Braithwaite, PagerDuty Inc.
  11. ! isLoading: reads('fetchTask.isRunning') Reginald @raganwald Braithwaite, PagerDuty Inc.

  12. using ember-concurrency to solve other problems Reginald @raganwald Braithwaite, PagerDuty

    Inc.
  13. chunking updates to our api Reginald @raganwald Braithwaite, PagerDuty Inc.

  14. 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.
  15. Reginald @raganwald Braithwaite, PagerDuty Inc.

  16. cancellation aTask.cancelAll(); anInstance.cancel(); Reginald @raganwald Braithwaite, PagerDuty Inc.

  17. a bigger challenge Reginald @raganwald Braithwaite, PagerDuty Inc.

  18. In JavaScript, AJAX requests happen concurrently. Reginald @raganwald Braithwaite, PagerDuty

    Inc.
  19. Reginald @raganwald Braithwaite, PagerDuty Inc.

  20. ⛈ websocket ping: [-----------------] submit update: [-----------] Reginald @raganwald Braithwaite,

    PagerDuty Inc.
  21. ☀ Reginald @raganwald Braithwaite, PagerDuty Inc.

  22. sharing one task task(function * (promissoryThunk) { let result; yield

    promissoryThunk().then(value => { result = value; }); return result; }).enqueue() Reginald @raganwald Braithwaite, PagerDuty Inc.
  23. serialized results websocket ping: [--------] submit update: [-------] Reginald @raganwald

    Braithwaite, PagerDuty Inc.
  24. ⁉ Reginald @raganwald Braithwaite, PagerDuty Inc.

  25. task groups tasks: taskGroup().enqueue(), handlePing: task(function * () { //

    ... }).group('tasks'), submitUpdate: task(function * () { // ... }).group('tasks') Reginald @raganwald Braithwaite, PagerDuty Inc.
  26. ember-concurrency conclusion Reginald @raganwald Braithwaite, PagerDuty Inc.

  27. Simple things are easy, complex things are possible. Reginald @raganwald

    Braithwaite, PagerDuty Inc.
  28. Reginald @raganwald Braithwaite, PagerDuty Inc.