Web performance introduction boston web performance meetup


Published on

1 Like
  • Be the first to comment

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide

Web performance introduction boston web performance meetup

  1. 1. Boston Web Performance Meetup<br />6/16/2010 <br />
  2. 2. Why Web Performance?<br />Faster sites boost conversion and help the bottom line<br />Where is the evidence?<br />
  3. 3. Firefox<br />1 second improvement on landing page drives 10 million Firefox downloads/year.<br />Change all landing pages - 60 million additional downloads a year<br />
  4. 4. Bing<br />2 second slowdown changed queries/user by -1.8% and revenue/user by -4.3%.<br />
  5. 5. http://www.stevesouders.com/blog/2009/07/27/wikia-fast-pages-retain-users/<br />
  6. 6. Google<br />400 ms delay resulted in a -0.59% change in searches/user.<br />
  7. 7. Shopzilla<br />Site overhaul shaved 5 seconds off of load time<br />25% increase in page views<br />7-12% increase in revenue<br />50% reduction in hardware use<br />
  8. 8. http://velocityconference.blip.tv/file/2290648/<br />
  9. 9. WhatDoesLoad Time Mean?<br />Two main pieces:<br />End to End Latency<br />Time between user request and the final byte of the response.<br />Render Time<br />Time between the last byte of the response and the Document Complete event. <br />E2E Latency + Render Time = Page Load Time<br />Time between a user clicking a link and the page becoming usable.<br />
  10. 10. Break It Down Further:<br />DNS Lookup<br />Time to map the domain name (www.cookware.com) to an IP address<br />Initial Connection<br />Time to open a connection to the server and get an acknowledgement<br />Wait Time<br />Time between initial connection and the first byte of the response (time it takes the server to “cook” the page).<br />Content Download<br />Time it takes to download the content that the server has finished creating<br />
  11. 11. Time to First Byte (TTFB)<br />DNS Lookup + Initial Connection + Wait Time<br />measurement of server/network performance<br />
  12. 12. What Affects Load Time?<br />Do we attack E2E Latency or Render Time?<br />Both<br />80-90% of load time takes place in the browser<br />Server:<br />Optimize Code<br />Eliminate DB lookups<br />Reduceload on server (perhapsthroughcaching)<br />
  13. 13. Client SideOptimizations<br />Reduce # of CSS/JS includes<br />Sprite images<br />Reduce # of cookies, make cookies smaller<br />Optimize JS code, reduce amount of it<br />Load resources asynchronously<br />Use a CDN<br />GZIP components<br />Minify CSS/JS<br />Avoid redirects and 404’s<br />Steve Souders: 14 rules for High Performance Web Sites<br />
  14. 14. ThreeBuckets for the Frontend<br />Reduce the number of requests the browser has to make.<br />Reduce overall page weight (KB on the wire).<br />Make the browser do less work (executing code, painting, etc.).<br />
  15. 15. JavaScript canbe a HUGE problem<br />Affects all threebuckets (requestit, downloadit, executeit). <br />How do wefixit?<br />Use a library (YUI, JQuery, etc.) <br />Loaditasynchronously<br />Progressivelyenhance<br />
  16. 16. http://www.pcmag.com/article2/0,2817,2364858,00.asp<br />
  17. 17. Tools/Books <br />Web:<br />WebPagetest - http://www.webpagetest.org/<br />Firebug - http://getfirebug.com/<br />YSlow - http://developer.yahoo.com/yslow/<br />PageSpeed - http://code.google.com/speed/page-speed/<br />Dynatrace AJAX Edition - http://ajax.dynatrace.com/pages/<br />Books:<br />High Performance Websites – Steve Souders<br />EvenFasterWebsites – Steve Souders<br />WebsiteOptimization – Andrew B. King (includes SEO)<br />
  18. 18. Conclusions<br />Plenty of areas for improvement.<br />First timers - easy to makehuge gains.<br />There isalways more youcan do.<br />Youruserswill love you (subconsciously in some cases).<br />Let’s figure out ways to makewebsitesfaster!<br />