Velocity 2010

606 views

Published on

Presentation done in 25/10/2010

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
606
On SlideShare
0
From Embeds
0
Number of Embeds
3
Actions
Shares
0
Downloads
8
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Velocity 2010

  1. 1. VELOCITY 2010 fast by default segunda-feira, 25 de outubro de 2010
  2. 2. HIGH PERFORMANCE WEB SITES segunda-feira, 25 de outubro de 2010
  3. 3. High YSlow Average Home .........................................A Dashboard ......................................... B Permalink/Your Memes ......................................... B segunda-feira, 25 de outubro de 2010
  4. 4. WEB PAGETEST segunda-feira, 25 de outubro de 2010
  5. 5. WEB PAGETEST segunda-feira, 25 de outubro de 2010
  6. 6. IMPROVEMENTS LOAD ORDER(SPLIT) AND RENDER segunda-feira, 25 de outubro de 2010
  7. 7. LOAD ORDER(SPLIT) segunda-feira, 25 de outubro de 2010
  8. 8. SPLIT SCRIPTS EFFICIENTLY segunda-feira, 25 de outubro de 2010
  9. 9. SPLIT SCRIPTS EFFICIENTLY Use cross page cache segunda-feira, 25 de outubro de 2010
  10. 10. SPLIT SCRIPTS EFFICIENTLY Use cross page cache Use Data to Split segunda-feira, 25 de outubro de 2010
  11. 11. Authenticated vs Public MEME, fromYahoo! 1000/1 U.P.P.A (segundo PedroValente) segunda-feira, 25 de outubro de 2010
  12. 12. Permalink (530k/886k) Non Authenticated minipost more comments user card ckeditor tooltip user menu repost follow live briefing Authenticated segunda-feira, 25 de outubro de 2010
  13. 13. Authenticated vs Public Split by: SCRIPTS FOR AUTHENTICATED USERS SCRIPTS FOR PUBLIC USERS segunda-feira, 25 de outubro de 2010
  14. 14. Split by Necessity of Execution Load Order Improvement segunda-feira, 25 de outubro de 2010
  15. 15. segunda-feira, 25 de outubro de 2010
  16. 16. Split by Necessity of Execution Yahoo ......................................... 16% Facebook ............................................ 9% segunda-feira, 25 de outubro de 2010
  17. 17. Split by Necessity of Execution Yahoo ......................................... 16% Facebook ............................................ 9% Meme ....................................... ˜15% segunda-feira, 25 de outubro de 2010
  18. 18. Spliting Scripts SCRIPTS FOR AUTHENTICATED USERS (what have to be executed) SCRIPTS FOR PUBLIC USERS (what have to be executed) segunda-feira, 25 de outubro de 2010
  19. 19. Spliting Scripts Your Memes ............ 358k (-15%) = 53.7k Dashboard ................. 710k (-15%) = 106k segunda-feira, 25 de outubro de 2010
  20. 20. Spliting Scripts Tool: Doloto (MS Research) http://research.microsoft.com/en-us/projects/doloto/ segunda-feira, 25 de outubro de 2010
  21. 21. Spliting Scripts (Techniques) XHR Eval XHR Injections Script in Iframe Script DOM Element Script Defer segunda-feira, 25 de outubro de 2010
  22. 22. Spliting Scripts (Techniques) XHR Eval XHR Injections Script in Iframe Script DOM Element Script Defer segunda-feira, 25 de outubro de 2010
  23. 23. RENDERING segunda-feira, 25 de outubro de 2010
  24. 24. HTML CSS INLINE CSS INLINE JS DONE! BLOCK RENDERING BLOCK RENDERING BLOCK RENDERING & DOWNLOADS segunda-feira, 25 de outubro de 2010
  25. 25. AVOID INLINE Block downloads and rendering segunda-feira, 25 de outubro de 2010
  26. 26. PERCEPTION OF PERFORMANCE segunda-feira, 25 de outubro de 2010
  27. 27. PERCEPTION OF PERFORMANCE segunda-feira, 25 de outubro de 2010
  28. 28. PERCEPTION OF PERFORMANCE Feedback and Responsiveness segunda-feira, 25 de outubro de 2010
  29. 29. OLDTECHNIQUES Progressive Bar Loaders segunda-feira, 25 de outubro de 2010
  30. 30. NOT SO OLDTECHNIQUES.. Progressive Enhancement segunda-feira, 25 de outubro de 2010
  31. 31. NOT SO OLDTECHNIQUES.. ChunkedTransfer Encoding segunda-feira, 25 de outubro de 2010
  32. 32. Chunked Tranfer Encoding Is a mechanism of HTTP 1.1 Split response data and transmitting each chuck with its size segunda-feira, 25 de outubro de 2010
  33. 33. segunda-feira, 25 de outubro de 2010
  34. 34. segunda-feira, 25 de outubro de 2010
  35. 35. <html> <head>....</head> <body> <div id=”hot_news”> [...] </div> <div id=”old_news”> [...] </div> <div id=”other_options”> [...] </div> </body> </html> 1 2 3 4 segunda-feira, 25 de outubro de 2010
  36. 36. Better used when the site structure is in sync with this strategy segunda-feira, 25 de outubro de 2010
  37. 37. chunckview Tool segunda-feira, 25 de outubro de 2010
  38. 38. segunda-feira, 25 de outubro de 2010
  39. 39. segunda-feira, 25 de outubro de 2010
  40. 40. segunda-feira, 25 de outubro de 2010
  41. 41. Facebook Big Pipe chunked tranfer encoding + pagelets segunda-feira, 25 de outubro de 2010
  42. 42. segunda-feira, 25 de outubro de 2010
  43. 43. RECOMMENDED PRESENTATIONS segunda-feira, 25 de outubro de 2010
  44. 44. Stupid Web Caching (and Other Intermediary) Tricks Mark Nottingham - @mnot -Yahoo segunda-feira, 25 de outubro de 2010
  45. 45. The Top 5 Mistakes of Massive CSS Nicole Sullivan - @stubbornella - Facebook segunda-feira, 25 de outubro de 2010
  46. 46. TCP and The Lower Bound of Web Performance Creating Cultural Change John Rauser - @jrauser - Amazon segunda-feira, 25 de outubro de 2010
  47. 47. JSMeter: Characterizing Real-World Behavior of JavaScript Programs Ben Livshits - Microsoft Research Ben Zorn - Microsoft Research segunda-feira, 25 de outubro de 2010
  48. 48. CONCLUSIONS Focused on performance More frontend presentations Backend has domain specific problems segunda-feira, 25 de outubro de 2010

×