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.

Frontend Caching - The "new" frontier

2,588 views

Published on

You have done all the caching tricks in the book on the server side: memcache, apc, database cache and so on and squeezed every millisecond out of it, now your site is as fast as it will ever get. Well guess again !

Too often people forget that what you are effectively caching and creating with those technologies is the HTML part of the user response time, now if they are done correctly then HTML is 10 - 20% of your users response time, so there is room for a whole lot of improvements on those other 80 - 90%.

You will be taken through a couple of important steps to achieve this, such as how to optimize your JavaScript, CSS, Images, Cookies and a whole sleeve of other things that make frontend caching the magical place that it is.

After having attended this talk you will not only have learned to make your sites faster for your long term users but also people coming for the first time as well as people on slower connections.

Published in: Technology
  • Be the first to comment

Frontend Caching - The "new" frontier

  1. 1. Frontend Caching The “new” frontier ZendCon – San Jose, October 2009
  2. 2. Head of R&D at echolibre , pear extraordinaire, author and from Iceland Head of R&D at echolibre , pear extraordinaire, published author and an Icelander Who is Helgi ? Head of R&D at echolibre , pear extraordinaire, author and from Iceland
  3. 8. 80% of response time is spent downloading content
  4. 11. “ It all depends on how we look at things, and not how they are in themselves.” - Carl G. Jung
  5. 14. Key factor in performance Fewer HTTP Requests Easy to improve on
  6. 15. Sent with static content Slow upstream speed Big cookies
  7. 16. Cookie Size Response Time (Delta) 0 bytes 78 ms ( 0 ms ) 500 bytes 79 ms ( +1 ms ) 1000 bytes 94 ms ( +16 ms ) 1500 bytes 109 ms ( +31 ms ) 2000 bytes 125 ms ( +47 ms ) 2500 bytes 141 ms ( +63 ms ) 3000 bytes 156 ms ( +78 ms ) Times are for page loads on DSL (~800 kbps).
  8. 17. Eliminate unnecessary cookies Keep sizes low Appropriate domain levels Set Expires date appropriately
  9. 18. Be aware of max connection limits in browsers CNAME to point multiple sub domains to the same IP
  10. 19. One domain = 2 Parallel connections
  11. 20. Two domains = 4 Parallel connections
  12. 21. Too many hostnames can cause complications 2 – 4 sub domains is a good average
  13. 22. Combining 6 scripts into 1 eliminates 5 requests Challenges: <ul><ul><li>develop as separate modules
  14. 23. combinations vs. loading more than needed </li></ul></ul>
  15. 24. JS does not comply with the parallel downloading rule
  16. 25. script defer attribute is not a solution <ul><ul><li>blocks rendering and downloads in FF
  17. 26. slight blocking in IE </li></ul></ul>Solution: move them as low in the page as possible
  18. 27. Crushes the files Strips out all cruft Voodoo magic
  19. 28. JSMin Dojo Shrinksafe Packer YUI Compressor http://short.ie/compression-rates
  20. 29. You can affect users download times
  21. 30. <ul>Gzip can be used on </ul><ul><ul><li>JS
  22. 31. CSS
  23. 32. XML
  24. 33. JSON </li></ul></ul>
  25. 34. <ul>Gzip should not be used on </ul><ul><ul><li>Images
  26. 35. PDFs
  27. 36. Compressed data formats </li></ul></ul>
  28. 37. robots.txt favicon
  29. 38. CSS Sprites favicon
  30. 39. Badly optimized Thumbnails PNG can be compacted 50%, no quality loss OptiPNG
  31. 40. Test on slow connections Slow proxies for developers
  32. 41. Data served through a single domain Smart routing software Data closer to the end user – Less latency
  33. 42. Amazon CloudFront
  34. 43. Appropriate dates Cache far in the future Change file names on releases
  35. 44. Firebug Firecookie Yslow Hammerhead http://stevesouders.com/hammerhead/
  36. 45. “ Knowledge rests not upon truth alone, but upon error also.” - Carl G. Jung
  37. 46. Questions? Email: [email_address] Twitter: @h http://joind.in/talk/view/893

×