The Shape of Speed
0 likes550 views
The document discusses web rendering performance, emphasizing the importance of reducing render time for a better user experience. Key points include the necessity of prioritizing rendering tasks, the impact of caching, and the use of 'timesliced rendering' to enhance responsiveness. It highlights various rendering challenges such as plateaus and valleys, and suggests strategies to mitigate them.
The Shape of Speed
- 2. TheShapeofSpeed By Oliver Tse January 6, 2016
- 5. Seriously…
- 6. Broader,whenyouwalkout…grok ● “Render first. JavaScript second.” ● Reduce render time and create a better experience. ● When, what and how much you render is very important
- 7. Whatwe’lltalkabout 1. All rendering 2. Chart parts 3. Flat 4. Cache is king 5. JavaScript 6. Fix-a-flat 7. Comparing
- 18. Webpagetestinfo/parameters ● Synthetic testing ● Only looks at above-the-fold ● Private instance of webpagetest.org ● 5 “first time” runs ● Chrome ( latest ) ● Cable 5/1 mbps 28ms RTT
- 19. 2 Chartparts
- 20. Yahoo!
- 23. Plateaus
- 24. flatareas
- 28. Valleys
- 29. dips
- 31. Nowyouseeit
- 32. Nowyoudon’t!
- 34. Cliffs
- 35. steep.Tall.
- 38. Hills
- 43. 3 Flat
- 47. Beforefirstrender,Jobsgetsassets... ● 1 HTML ● 2 images ● 2 stylesheets ● 12 JavaScript files
- 73. 4. Cacheisking
- 80. 5. JavaScript
- 90. So,whatdowedo?
- 95. Google’sRAIL
- 97. Benefits ● Responsive UI ● Progressive rendering
- 100. 6. Fix-a-flat
- 101. PYMK
- 106. Homepage
- 110. Stuffthat’llgethills ● Animations ● Deferred images ● Progressive images ● Time-sliced rendering
- 111. Comparing
- 112. browsers
- 114. versions
- 116. internationals
- 118. Thankyou!