Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Ember At Scale

Using Ember At LinkedIn

  • Login to see the comments

  • Be the first to like this

Ember At Scale

  1. 1. EMBER AT SCALE
  2. 2. @chadhietala
  3. 3. THIS IS OUR STORY
  4. 4. 2013
  5. 5. PRODUCT & TECH BALANCE
  6. 6. WHAT YEAR IS IT?
  7. 7. “If it ain’t broken don’t fix it.” - Someone not in the Javascript community
  8. 8. 2014
  9. 9. SOFTWARE ROT
  10. 10. UNIFY & REDUCE COMPLEXITY
  11. 11. CONSIDERATIONS
  12. 12. CENTRALIZED SUPPORT
  13. 13. LESS IS MORE
  14. 14. CHANGE IS THE CONSTANT
  15. 15. SOLVING PROBLEMS
  16. 16. INITIAL RENDER
  17. 17. BASE PAGE RENDERER (BPR)
  18. 18. BIG PIPE
  19. 19. Server Server STORE AND FORWARD CHUNKED ENCODING NETWORK BOUNDARY
  20. 20. BPR Such Web Scale API Server Ember App Browser
  21. 21. Such Web Scale API Server Ember App linkedin.com/profile/123 BPRAPI Server Ember App Browser
  22. 22. <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>LinkedIn : Profile</title> <link href=“app.css” rel=“stylesheet” type=“text/css" /> </head> <body> <script src=“vendor.js”></script> <script src=“app.js”></script> Such Web Scale API Server Ember App linkedin.com/profile/123 BPRAPI Server Ember App Browser
  23. 23. Such Web Scale API Server Ember App linkedin.com/profile/123 BPRAPI Server Ember App Browser appInstance.visit(‘/profile/123’)
  24. 24. Such Web Scale API Server Ember App linkedin.com/profile/123 BPRAPI Server Ember App Browser appInstance.visit(‘/profile/123’) [‘/profile/123’, /config/123’]
  25. 25. npm install ember-prefetch
  26. 26. TRADITIONAL EMBER APP WITH EMBER-PREFETCH
  27. 27. Such Web Scale { data: {…} }API Server Ember App linkedin.com/profile/123 BPRAPI Server Ember App Browser appInstance.visit(‘/profile/123’)
  28. 28. <code id=“bpr-guid-3243243”>{&quot;data&uote;:{…}}</code> <script class=“bpr-response”> _bpr.response({ request: ‘/profile/123’, status: 200, body: ‘bpr-guid-3243243’}) </script> Such Web Scale API Server Ember App linkedin.com/profile/123 BPRAPI Server Ember App Browser appInstance.visit(‘/profile/123’)
  29. 29. bit.ly/resource-discovery
  30. 30. ember fastboot --resource-discovery
  31. 31. SERVING THE APP
  32. 32. JVM Such Web Scale Base Page Controller Renderer Instance Process Manager Instance Channel Channel Node API Proxy Ember Renderer Ember App linkedin.com/profile/123 Instance
  33. 33. JVM Such Web Scale Base Page Controller Renderer Instance Process Manager Instance Channel Channel Node API Proxy Ember Renderer Ember App linkedin.com/profile/123 Instance
  34. 34. JVM Such Web Scale Base Page Controller Renderer Instance Process Manager Instance Channel Channel Node API Proxy Ember Renderer Ember App linkedin.com/profile/123 Instance
  35. 35. JVM Such Web Scale Base Page Controller Renderer Instance Process Manager Instance Channel Channel Node API Proxy Ember Renderer Ember App linkedin.com/profile/123 Instance
  36. 36. JVM Such Web Scale Base Page Controller Renderer Instance Process Manager Instance Channel Channel Node API Proxy Ember Renderer Ember App linkedin.com/profile/123 Instance
  37. 37. JVM Such Web Scale Base Page Controller Renderer Instance Process Manager Instance Channel Channel Node API Proxy Ember Renderer Ember App linkedin.com/profile/123 Instance
  38. 38. DEPLOYMENTS
  39. 39. V8
  40. 40. npm install chrome-tracing
  41. 41. OH YEA
  42. 42. linkedin.com/m/ Sorry, for the “Please Download The App” interim :(
  43. 43. THANKS @chadhietala

×