Presented at Open Source Barcamp 2010 in Dublin

1. Open-source website performance tools
Artur Cistov - OSSBarcamp Dublin 2010

2. Why bother with web performance?
Business Reasons:
500ms slower = 20% drop in traffic (Google)
400ms slower = 5-9% drop in full-page traffic
(Yahoo)
100ms slower = 1% drop in sales (Amazon)
Source: http://www.slideshare.net/stoyan/yslow-20-presentation

3. Why bother with web performance?
Mobile Web Specifics
E.g. iPhone:
small cache size (up to 25Kb
per file)
slow network speed (typical
data download speed varies
from 82 kbps to 150 kbps).
Source: http://yuiblog.com/blog/2008/02/06/iphone-cacheability/

4. Why bother with web performance?
Significant performance improvements allow to
build new, more responsive web applications &
expand into areas previously only covered by
desktop software.
Sunspider 0.9.1 Results
IE8 10277.8ms +/- 1.9%
Chrome 4.1 1123.9ms +/- 7.7%

5. Focus on the frontend
80-90% of the end-user
response time is spent on the
frontend.
E.g. RTE.IE: 755/793Kb (95%)

6. Common Techniques
Fewer HTTP Requests
Expires & Cache control headers
Gzip compression
Filesize
Make JavaScript and CSS External
Load scripts without blocking
Split the initial payload

7. Google Page Speed
Open-source Firefox/Firebug Add-on

8. Google Page Speed
Used on Google Maps & Gmail
Automatically compresses & saves JPEG and
PNG files
Lists potential savings from minifying & gzipping
Presents network activity data
Finds unused CSS rules
Finds inefficient CSS rules
Estimates percentage of JavaScript code eligible
for lazy-loading
Allows to export data in JSON format
Painting snapshots

9. Paint event snapshots

10. RTE.IE
Minifying JS could save 25.8kB (16.4% reduction).
Minifying CSS could save 11.0kB (32% reduction).
Minifying HTML could save 9.5kB (24% reduction).
Compressing with gzip could save 150.4kB (71%
reduction) of relevant files.
61.3% of the JavaScript loaded by this page had not
been invoked by the time the onload handler
completed.
64.6% of CSS (estimated 21.7kB of 33.6kB) is not
used by the current page.

11. Google Closure Compiler

12. Google Closure Compiler
Open-source, written in Java & easy to extend
Three modes
Up to 60-70% filesize savings
Performs advanced code transforms based on syntax
tree including constant & function inlining, dead code
removal etc.
Highlights code patterns that may not work well on all
browsers

13. Cuzillion
Open-source web performance exploration tool

14. Dustme Selectors
Open-source Firefox Add-on
Finds unused CSS selectors
Caters for common CSS hacks
You can test pages
individually, or spider an entire
site

15. Books
v

16. Links
Yahoo Exceptional performance team
http://developer.yahoo.com/performance/
Google Performance resources
http://code.google.com/speed/
Steve Souders, ex Chief Performance Yahoo
http://stevesouders.com/

17. Thanks
http://www.slideshare.net/cistov
http://www.twitter.com/cistov