Open-source website performance tools




           Artur Cistov - OSSBarcamp Dublin 2010
Why bother with web performance?

Business Reasons:

500ms slower = 20% drop in traffic (Google)
400ms slower = 5-9% drop ...
Why bother with web performance?
            Mobile Web Specifics

            E.g. iPhone:
               small cache siz...
Why bother with web performance?
Significant performance improvements allow to
build new, more responsive web applications...
Focus on the frontend
    80-90% of the end-user
    response time is spent on the
    frontend.

    E.g. RTE.IE: 755/793...
Common Techniques

Fewer HTTP Requests
Expires & Cache control headers
Gzip compression
Filesize
Make JavaScript and CSS E...
Google Page Speed
Open-source Firefox/Firebug Add-on
Google Page Speed
Used on Google Maps & Gmail
Automatically compresses & saves JPEG and
PNG files
Lists potential savings ...
Paint event snapshots
RTE.IE
Minifying JS could save 25.8kB (16.4% reduction).
Minifying CSS could save 11.0kB (32% reduction).
Minifying HTML c...
Google Closure Compiler
Google Closure Compiler
Open-source, written in Java & easy to extend
Three modes
Up to 60-70% filesize savings
Performs a...
Cuzillion
Open-source web performance exploration tool
Dustme Selectors
Open-source Firefox Add-on

               Finds unused CSS selectors
               Caters for common CS...
Books



        v
Links

Yahoo Exceptional performance team
http://developer.yahoo.com/performance/

Google Performance resources
http://cod...
Thanks
http://www.slideshare.net/cistov
  http://www.twitter.com/cistov
Upcoming SlideShare
Loading in …5
×

Open-source website performance tools

1,441 views

Published on

Presented at Open Source Barcamp 2010 in Dublin

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
1,441
On SlideShare
0
From Embeds
0
Number of Embeds
4
Actions
Shares
0
Downloads
28
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Open-source website performance tools

  1. 1. Open-source website performance tools Artur Cistov - OSSBarcamp Dublin 2010
  2. 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. 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. 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. 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. 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. 7. Google Page Speed Open-source Firefox/Firebug Add-on
  8. 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. 9. Paint event snapshots
  10. 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. 11. Google Closure Compiler
  12. 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. 13. Cuzillion Open-source web performance exploration tool
  14. 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. 15. Books v
  16. 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. 17. Thanks http://www.slideshare.net/cistov http://www.twitter.com/cistov

×