Download as PDF, PPTX
Uploaded byStephen Thair
Performance automation 101 @LDNWebPerf MickMcGuinness
The document discusses various techniques for frontend optimization to improve website performance, highlighting the challenges of manual coding and the importance of leveraging existing tools and technologies. It emphasizes that a significant percentage of websites are not implementing basic optimization practices, such as caching or compression. The document suggests evaluating multiple optimization options, including CMS plugins and SaaS solutions, to enhance speed and efficiency.
More Related Content
Similar to Performance automation 101 @LDNWebPerf MickMcGuinness
Performance automation 101 @LDNWebPerf MickMcGuinness
- 1. Performance Automation faster ways to make your website faster mick.mcguinness@applicationperformance.com @AppPerf Confidential © www.applicationperformance.com Performance is our business!
- 2. Topics Quick recap from last time Frontend optimization The optimization techniques Who is using them? If not why not? How to apply the techniques faster Manual coding .htaccess file PHP Libraries CMS plugins Web Server software/modules Hardware appliances SaaS Solutions and Advanced CDNs Confidential © www.applicationperformance.com Performance is our business!
- 3. What do wemean by Frontend Time? Definition Steve Souders “High-Performance Websites” Confidential © www.applicationperformance.com Performance is our business!
- 4. Why front-end Optimization? Over 80% of the page load time is spent outside the data centre!!! Steve Souders “High-Performance Websites” Confidential © www.applicationperformance.com Performance is our business!
- 5. The Tools Yahoo YSlow Google PageSpeed Take your pick, the rules are roughly equivalent. Confidential © www.applicationperformance.com Performance is our business!
- 6. 5 Important Ones 1. Reduce Page Size (<500Kb) 2. Enable (Gzip) Compression 3. Reduce the number of roundtrips (<40 per page…) 4. Structure the page (to improve render & download) CSS First Javascript last 5. Cache, Cache, Cache Confidential © www.applicationperformance.com Performance is our business!
- 7. Are sites applyingthe rules? Percent of sites that got a passing grade for the basic optimization checks: Percent of pages with a passing grade Optimization (2010) Keep-alive Enabled 85% Compress Text 43% Compress Images 39% Cache Static Content 15% Combine JS/CSS 47% CDN Usage 12% These aren't the advanced optimizations - they're the most basic. Only 15% of pages are effectively leveraging the browser cache! (and "passing" is pretty generous here - a score of 80 or better). http://blog.patrickmeenan.com/ Confidential © www.applicationperformance.com Performance is our business!
- 8. Analysis of FTSE350 Frontend vs Backend Time Confidential © www.applicationperformance.com Performance is our business!
- 9. Top 5 andBottom 5 for FTSE 350 Top 5 Repeat FV Global RV Global Repeat First View View - Average Average First View View Size - HTTP HTTP Load Load URL Size (KB) (KB) Requests Requests YSlow Server Details Time Time http://www.ccruk.com/ 112 47 15 13 63 Microsoft-IIS/5.0 1.916 7.565 http://www.tesco.com/ 106 13 11 1 71 Microsoft-IIS/6.0 ASP.NET 2.047 0.663 http://www.whsmithplc.co.uk/ 49 3 7 6 82 Microsoft-IIS/6.0 ASP.NET 2.076 1.474 http://www.antofagasta.co.uk/ 73 15 9 8 94 Apache 2.148 1.483 http://www.giml.co.uk/ 90 5 10 9 68 Microsoft-IIS/6.0 ASP.NET 2.525 1.779 Bottom 5 Repeat Repeat First View View - FV Global RV Global First View View Size - HTTP HTTP Average Average URL Size (KB) (KB) Requests Requests YSlow Server Details Load Time Load Time http://www.renishaw.com/ 1812 55 108 107 65 WS6 53.228 14.912 http://www.eddiestobart.co.uk/ 4125 18 66 62 47 Apache/2.0.52 (CentOS) 47.342 19.218 http://www.rpsgroup.com/ 585 107 25 21 51 Microsoft-IIS/6.0 ASP.NET 36.791 29.976 http://www.vedantaresources.com/ 1010 17 35 33 44 Microsoft-IIS/6.0 ASP.NET 36.361 7.926 http://www.carillionplc.com/ 387 37 50 48 54 Microsoft-IIS/5.0 ASP.NET 32.949 6.652 Full list http://www.aptimize.com/Upload/docs/FTSE.pdf Confidential © www.applicationperformance.com Performance is our business!
- 10. tesco.com Second fastest home page in FTSE 350 Rich looking site but only 11 requests and 108K Confidential © www.applicationperformance.com Performance is our business!
- 11. Why isn’t everyoneusing the rules? Possible Reasons They don’t know about them They may still be focussing inside the data center They can be difficult to apply Let’s take a look at some ways to make it easier Confidential © www.applicationperformance.com Performance is our business!
- 12. Manual Coding Pros Anyone think of any??? Cons Time consuming. Developers would rather write new functionality. Not a one off. Needs to be repeated each time the site is updated. Some of the techniques are very difficult to implement manually. Difficult to do within most CMS environments Need to keep up to date with new techniques and new browsers as they become available. Confidential © www.applicationperformance.com Performance is our business!
- 13. Manual Coding Examples Image optimization http://www.phpied.com/command-line-css-spriting/ http://www.smushit.com/ysmush.it/ http://csssprites.org/ JS and CSS minification http://developer.yahoo.com/yui/compressor/ http://www.crockford.com/javascript/jsmin.html Confidential © www.applicationperformance.com Performance is our business!
- 14. .htaccess Pros It’s FREE! (from Sergey Chernyshev) It is easy to implement Cons Apache or NginX only It won’t do all the optimizations. What it does is: Compression for text mime-types (mod_deflate) File versioning for static resources (mod_rewrite) Far-future cache expiry headers (mod_expires) Examples http://www.showslow.com/blog/drop-in-htaccess-is- now-on-github-go-fork-it/ Confidential © www.applicationperformance.com Performance is our business!
- 15. PHP Libraries Pros Free in some cases Same optimizations as .htaccess technique but in some cases can also do additional techniques like: JS/CSS file combination and minification Cons PHP and Apache Only It won’t do all the optimizations. Examples http://farhadi.ir/works/smartoptimizer (GPL Open Source) http://www.webogroup.com/home/site-speedup/ (Free & Commercial versions) http://projects.westhost.com/contest/php/function/minify-css-js- and-cache-output/187 (Free) Confidential © www.applicationperformance.com Performance is our business!
- 16. CMS Plugins Pros FREE in many cases Cons Specific to the CMS They won’t do all the optimizations Examples http://extensions.joomla.org/extensions/site-management/site- performance http://www.liferay.com/ (Built in CSS and JS combination and minification) http://wimleers.com/article/improving-drupals-page-loading- performance (Built in CSS and JS combination and minification) Confidential © www.applicationperformance.com Performance is our business!
- 17. Acceleration Software/Modules Pros Quick to install. Automatically apply the most optimizations without code changes or hardware. Vendors continually develop to add support for new optimizations and browsers as they come along. Cons Beware of conflicts with other modules. Examples Aptimize www.aptimize.com (Commercial, any server) Google mod_pagespeed (Open Source, Apache only) Confidential © www.applicationperformance.com Performance is our business!
- 18. Aptimize example microsoft.com Load Time = 4.0 seconds Load Time = 9.1 seconds Fully Loaded = 6.8 seconds Fully Loaded = 13.2 seconds Page size = 501 KB Page size = 1251 KB Requests = 21 Requests = 84 http://www.webpagetest.org/result/110125_CX_1J71/ http://www.webpagetest.org/result/110125_VS_1J72/ Confidential © www.applicationperformance.com Performance is our business!
- 19. Hardware Appliances Traditional Load balancers have evolved to do additional tasks (Application Delivery Controllers) Pros Offload tasks from the web server such as: Gzip compression SSL termination Caching Some are starting to do more frontend optimization techniques too. Cons They won’t do all the optimizations You need to install extra hardware Confidential © www.applicationperformance.com Performance is our business!
- 20. Hardware Appliances Examples F5 Networks Citrix Netscaler Zeus StrangeLoops ActivNetworks We are seeing some convergence between network layer acceleration and application layer acceleration devices. Confidential © www.applicationperformance.com Performance is our business!
- 21. SaaS Solutions Pros No on site hardware or software needed Cons DNS points to the provider so your site availability outside your control Examples http://www.strangeloopnetworks.com/products/site- optimizer-service/ Confidential © www.applicationperformance.com Performance is our business!
- 22. Next generation CDNs Global edge caches with the addition of ‘middle mile acceleration’ which optimizes how data travels Pros No on site hardware or software needed TCP/IP optimization for middle mile Reduces round-trips Cons It won’t do all the optimizations. Confidential © www.applicationperformance.com Performance is our business!
- 23. Next generation CDNs Examples http://www.cotendo.com/services/DSA/ http://www.us.cdnetworks.com/dynamic_web_acceleration Confidential © www.applicationperformance.com Performance is our business!
- 24. Summary Many sites are not following the rules for frontend optimization. Doing it manually is time consuming There are several better options to help you do things quicker and easier. Evaluate multiple options and benchmark Confidential © www.applicationperformance.com Performance is our business!
- 25. Questions? Confidential © www.applicationperformance.com Performance is our business!
- 26. About Me 15yrs IT experience Started in 1996 as a C/C++ and Oracle developer Performance Consultant at Precise Software 1998-2003 Founded Application Performance Ltd in 2004-present e:mick.mcguinness@applicationperformance.com m:+44 7876 680410 Twitter: http://twitter.com/AppPerf LinkedIn: http://www.linkedin.com/in/mickmcguinness Skype: mick_mcguinness Confidential © www.applicationperformance.com Performance is our business!