Ember.js
backburner.js and rsvp.js
@gavinjoyce
A framework for creating
ambitious web applications
Need help building
something ambitious?

gavinjoyce@gmail.com
Need help building
something ambitious?

gavinjoyce@gmail.com
Need help building
something ambitious?

gavinjoyce@gmail.com
Need help building
something ambitious?

gavinjoyce@gmail.com
Need help building
something ambitious?

gavinjoyce@gmail.com
rsvp.js
backburner.js

rsvp.js
backburner.js
backburner.js

https://github.com/ebryn/backburner.js
backburner.js
backburner.js
● The Ember.js Run Loop
backburner.js
● The Ember.js Run Loop
○ Schedules Operations
backburner.js
● The Ember.js Run Loop
○ Schedules Operations
■ Data Bindings
backburner.js
● The Ember.js Run Loop
○ Schedules Operations
■ Data Bindings
■ Actions
backburner.js
● The Ember.js Run Loop
○ Schedules Operations
■ Data Bindings
■ Actions
■ UI Rendering
backburner.js
● The Ember.js Run Loop
○ Schedules Operations
■ Data Bindings
■ Actions
■ UI Rendering

○ Coalesces Operati...
backburner.js
● The Ember.js Run Loop
backburner.js
● The Ember.js Run Loop
○ while(true) { … }
backburner.js
● The Ember.js Run Loop
○ while(true) { … }
backburner.js
● The Ember.js Run Loop
○ while(true) { … }
○ Triggered on ...
backburner.js
● The Ember.js Run Loop
○ while(true) { … }
○ Triggered on
■ UI events
backburner.js
● The Ember.js Run Loop
○ while(true) { … }
○ Triggered on
■ UI events
■ Ajax responses
backburner.js
● The Ember.js Run Loop
○ while(true) { … }
○ Triggered on
■ UI events
■ Ajax responses
■ Ember Data events
backburner.js

Run Loop Timing Demo
https://gist.github.com/GavinJoyce/6403776
backburner.js
● Queues - Ember.run.queues
○ sync - property bindings
○ actions - have access to resolved bindings
○ router...
backburner.js

Run Loop Queue Demo
by Alex Matchneer

http://bit.ly/1afSx2W
backburner.js

backburner.js without Ember
https://github.com/ebryn/backburner.js#example-usage
rsvp.js
rsvp.js

https://github.com/tildeio/rsvp.js
rsvp.js

https://github.com/tildeio/rsvp.js
● A tool for organising asynchronous code
rsvp.js

https://github.com/tildeio/rsvp.js
● A tool for organising asynchronous code
● A tiny Promises/A+ implementation
...
rsvp.js
rsvp.js
A promise is a potential future value
rsvp.js
A promise is a potential future value
(thanks to Stefan Penner for use of following slides)
rsvp.js
A promise is a potential future value
(thanks to Stefan Penner for use of following slides)
Promises Scale

Real World Example: http://bit.ly/1gmLytY
Example use of promises in an Ember.js application:
Other talks
rsvp.js:
● Domenic Denicola: http://youtu.be/mZHO1ZTsoFk?t=42m17s
● Stefan Penner: http://youtu.be/mZHO1ZTsoFk...
Questions?
Ember.js internals  backburner.js and rsvp.js
Ember.js internals  backburner.js and rsvp.js
Ember.js internals  backburner.js and rsvp.js
Ember.js internals  backburner.js and rsvp.js
Ember.js internals  backburner.js and rsvp.js
Ember.js internals  backburner.js and rsvp.js
Ember.js internals  backburner.js and rsvp.js
Ember.js internals  backburner.js and rsvp.js
Ember.js internals  backburner.js and rsvp.js
Ember.js internals  backburner.js and rsvp.js
Ember.js internals  backburner.js and rsvp.js
Ember.js internals  backburner.js and rsvp.js
Upcoming SlideShare
Loading in …5
×

Ember.js internals backburner.js and rsvp.js

1,085 views
865 views

Published on

0 Comments
3 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,085
On SlideShare
0
From Embeds
0
Number of Embeds
86
Actions
Shares
0
Downloads
16
Comments
0
Likes
3
Embeds 0
No embeds

No notes for slide

Ember.js internals backburner.js and rsvp.js

  1. 1. Ember.js backburner.js and rsvp.js @gavinjoyce
  2. 2. A framework for creating ambitious web applications
  3. 3. Need help building something ambitious? gavinjoyce@gmail.com
  4. 4. Need help building something ambitious? gavinjoyce@gmail.com
  5. 5. Need help building something ambitious? gavinjoyce@gmail.com
  6. 6. Need help building something ambitious? gavinjoyce@gmail.com
  7. 7. Need help building something ambitious? gavinjoyce@gmail.com
  8. 8. rsvp.js
  9. 9. backburner.js rsvp.js
  10. 10. backburner.js
  11. 11. backburner.js https://github.com/ebryn/backburner.js
  12. 12. backburner.js
  13. 13. backburner.js ● The Ember.js Run Loop
  14. 14. backburner.js ● The Ember.js Run Loop ○ Schedules Operations
  15. 15. backburner.js ● The Ember.js Run Loop ○ Schedules Operations ■ Data Bindings
  16. 16. backburner.js ● The Ember.js Run Loop ○ Schedules Operations ■ Data Bindings ■ Actions
  17. 17. backburner.js ● The Ember.js Run Loop ○ Schedules Operations ■ Data Bindings ■ Actions ■ UI Rendering
  18. 18. backburner.js ● The Ember.js Run Loop ○ Schedules Operations ■ Data Bindings ■ Actions ■ UI Rendering ○ Coalesces Operations
  19. 19. backburner.js ● The Ember.js Run Loop
  20. 20. backburner.js ● The Ember.js Run Loop ○ while(true) { … }
  21. 21. backburner.js ● The Ember.js Run Loop ○ while(true) { … }
  22. 22. backburner.js ● The Ember.js Run Loop ○ while(true) { … } ○ Triggered on ...
  23. 23. backburner.js ● The Ember.js Run Loop ○ while(true) { … } ○ Triggered on ■ UI events
  24. 24. backburner.js ● The Ember.js Run Loop ○ while(true) { … } ○ Triggered on ■ UI events ■ Ajax responses
  25. 25. backburner.js ● The Ember.js Run Loop ○ while(true) { … } ○ Triggered on ■ UI events ■ Ajax responses ■ Ember Data events
  26. 26. backburner.js Run Loop Timing Demo https://gist.github.com/GavinJoyce/6403776
  27. 27. backburner.js ● Queues - Ember.run.queues ○ sync - property bindings ○ actions - have access to resolved bindings ○ routerTransitions ○ render - DOM updates ○ afterRender - useful for wrapping plugins ○ destroy - object deletion
  28. 28. backburner.js Run Loop Queue Demo by Alex Matchneer http://bit.ly/1afSx2W
  29. 29. backburner.js backburner.js without Ember https://github.com/ebryn/backburner.js#example-usage
  30. 30. rsvp.js
  31. 31. rsvp.js https://github.com/tildeio/rsvp.js
  32. 32. rsvp.js https://github.com/tildeio/rsvp.js ● A tool for organising asynchronous code
  33. 33. rsvp.js https://github.com/tildeio/rsvp.js ● A tool for organising asynchronous code ● A tiny Promises/A+ implementation ○ http://promises-aplus.github.io/promises-spec/
  34. 34. rsvp.js
  35. 35. rsvp.js A promise is a potential future value
  36. 36. rsvp.js A promise is a potential future value (thanks to Stefan Penner for use of following slides)
  37. 37. rsvp.js A promise is a potential future value (thanks to Stefan Penner for use of following slides)
  38. 38. Promises Scale Real World Example: http://bit.ly/1gmLytY
  39. 39. Example use of promises in an Ember.js application:
  40. 40. Other talks rsvp.js: ● Domenic Denicola: http://youtu.be/mZHO1ZTsoFk?t=42m17s ● Stefan Penner: http://youtu.be/mZHO1ZTsoFk?t=1h26m backburner.js: ● Erik Bryn: http://www.youtube.com/watch?v=VuIFdXmi080&t=24m5s
  41. 41. Questions?

×