Go Faster, Webmaster

Mike Bailey

Melbourne Ruby Users GroupJuly, 2010

Go Faster, Webmaster!

Talks by techies from:

Google, Yahoo, Microsoft, Amazon, Twitter, Facebook, Firefox, Firebug, Chrome, Internet Explorer and more!

1200 attendees (sold out)

Mostly technical audience

The Need for Speed

The Need for Speed

"Average load time of a web page is 4.9 seconds"- Urs Hölzle, Google

The Google Analytics exit rate for different page load times collected from Wikia data. Measured over 29 million pageviews

The Need for Speed

"Average load time of a web page is 4.9 seconds"- Urs Hölzle, Google

The Need for Speed

"Average load time of a web page is 4.9 seconds"- Urs Hölzle, Google

"The goal should be around 100 ms, the time it takes for a reader to turn the page in a book"

- http://oreil.ly/bvYNk3

The Need for Speed

Google: +500 ms -20% traffic*Amazon: +100 ms -1% sales*

* http://bit.ly/9iRqAu

We monitor backend performance

but what about the front end?

17%

83%

iGoogle, primed cache

the importance of frontend performance

9% 91%

iGoogle, empty cache

Steve Souders http://bit.ly/Zxh4m

time spent on the frontendEmpty Cache Primed Cache

www.aol.com 97% 97%www.ebay.com 95% 81%www.facebook.com 95% 81%www.google.com/search 47% 0%search.live.com/results 67% 0%www.msn.com 98% 94%www.myspace.com 98% 98%en.wikipedia.org/wiki 94% 91%www.yahoo.com 97% 96%www.youtube.com 98% 97%

April 2008Steve Souders http://bit.ly/Zxh4m

The Performance Golden Rule

80-90% of the end-user response time is spent on the frontend. Start there.

greater potential for improvement

simpler

proven to work

Steve Souders http://bit.ly/Zxh4m

To Measure is to Know

To Measure is to Know

Firefox - Firebug -> Net Window

To Measure is to Know

Firefox - Firebug -> Net Window

Chrome, Safari -> Web Inspector

To Measure is to Know

Firefox - Firebug -> Net Window

Chrome, Safari -> Web Inspector

IE -> HTTPWatch ($395-$44,395)

To Measure is to Know

To Measure is to Know

webpagetest.org

To Measure is to Know

webpagetest.org

To Measure is to Know

webpagetest.org

Webmaster Tools -> Labs -> Site Performance

To Measure is to Know

webpagetest.org

Webmaster Tools -> Labs -> Site Performance

showslow.com

Commercial Monitoring Services

gomez.com

keynote.com

webmetrics.com

How do we speed up our pages?

How do we speed up our pages?

How do we speed up our pages?

14 RULES

1. MAKE FEWER HTTP REQUESTS2. USE A CDN3. ADD AN EXPIRES HEADER4. GZIP COMPONENTS5. PUT STYLESHEETS AT THE TOP6. PUT SCRIPTS AT THE BOTTOM7. AVOID CSS EXPRESSIONS8. MAKE JS AND CSS EXTERNAL9. REDUCE DNS LOOKUPS

10. MINIFY JS11. AVOID REDIRECTS12. REMOVE DUPLICATE SCRIPTS13. CONFIGURE ETAGS14. MAKE AJAX CACHEABLE

Analysis Tools

Analysis Tools

YSlow

Analysis Tools

YSlow

Page Speed

14 Rule Redux

Make Fewer Requests- combine javascripts, stylesheets- use css sprites- reduce DNS lookups- avoid redirects- enable proxy and browser caching of assets

Make Smaller Requests- gzip components- optimize images- minify javascript

Tools to Help

http://spriteme.org/

http://smush.it/

http://stevesouders.com/cuzillion/

The Problem(s) with TCP

The Problem(s) with TCP

RFC 2581 TCP Congestion Control

John Rauser http://oreil.ly/dkvpgM

John Rauser http://oreil.ly/dkvpgM

The Problem(s) with TCP

RFC 2581 TCP Congestion Control

The Problem(s) with TCP

RFC 2581 TCP Congestion Control

RFC 813 Delayed ACK

John Rauser http://oreil.ly/dkvpgM

John Rauser http://oreil.ly/dkvpgM

John Rauser http://oreil.ly/dkvpgM

Real World Data

http://mike.bailey.net.au/blog?p=38

The Problem(s) with TCP

RFC 2581 TCP Congestion Control

RFC 813 Delayed ACK

The Problem(s) with TCP

RFC 2581 TCP Congestion Control

RFC 813 Delayed ACK

Google have proposed improvements

Quick wins

Quick wins

Google AJAX Libraries API

Quick wins

Google AJAX Libraries API

GA Async Tracking Code

Want to learn more?

Videos from Velocity 2010 http://bit.ly/bL0Msz

Read Steve Souder's books,

"High Performance Web Sites" & "Even Faster Web Sites"