performance automation 101 @ldnwebperf mickmcguinness

Performance is our business! Confidential © www.applicationperformance.com

[email protected]

@AppPerf

Performance Automation faster ways to make your website faster


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


What do we mean by Frontend Time?

Definition Steve Souders “High-Performance Websites”


Why front-end Optimization?

Over 80% of the page load time is spent outside the data centre!!!

Steve Souders “High-Performance Websites”


The Tools

Yahoo YSlow

Google PageSpeed

Take your pick, the rules are roughly equivalent.


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


Are sites applying the rules?

Optimization Percent of pages with a passing grade

(2010)

Keep-alive Enabled 85%

Compress Text 43%

Compress Images 39%

Cache Static Content 15%

Combine JS/CSS 47%

CDN Usage 12%

Percent of sites that got a passing grade for the basic optimization checks:

http://blog.patrickmeenan.com/

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/


Analysis of FTSE 350

Frontend vs Backend Time


Top 5 and Bottom 5 for FTSE 350

URL

First View Size (KB)

Repeat View Size

(KB)

First View - HTTP

Requests

Repeat View -

HTTP Requests YSlow Server Details

FV Global Average

Load Time

RV Global Average

Load 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

URL

First View Size (KB)

Repeat View Size

(KB)

First View - HTTP

Requests

Repeat View - HTTP

Requests YSlow Server Details

FV Global Average

Load Time

RV Global Average

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

Top 5

Bottom 5

http://www.aptimize.com/Upload/docs/FTSE.pdf


tesco.com

Second fastest home page in FTSE 350

Rich looking site but only 11 requests and 108K


Why isn’t everyone using 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


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.


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











http://www.smushit.com/ysmush.it/







http://www.crockford.com/javascript/jsmin.html


.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/






















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)

http://farhadi.ir/works/smartoptimizer



http://www.webogroup.com/home/site-speedup/





http://projects.westhost.com/contest/php/function/minify-css-js-and-cache-output/187













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)

http://extensions.joomla.org/extensions/site-management/site-performance







http://www.liferay.com/

http://www.liferay.com/

http://wimleers.com/article/improving-drupals-page-loading-performance











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)

http://www.aptimize.com/

http://code.google.com/speed/page-speed/docs/module.html


Aptimize example microsoft.com

http://www.webpagetest.org/result/110125_VS_1J72/ http://www.webpagetest.org/result/110125_CX_1J71/

Load Time = 4.0 seconds Fully Loaded = 6.8 seconds Page size = 501 KB Requests = 21

Load Time = 9.1 seconds Fully Loaded = 13.2 seconds Page size = 1251 KB Requests = 84

http://www.webpagetest.org/result/110125_VS_1J72/

http://www.webpagetest.org/result/110125_VS_1J72/

http://www.webpagetest.org/result/110125_CX_1J71/

http://www.webpagetest.org/result/110125_CX_1J71/


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


Hardware Appliances

Examples

F5 Networks

Citrix Netscaler

Zeus

StrangeLoops

ActivNetworks

We are seeing some convergence between network layer acceleration and application layer acceleration devices.


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/







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.


Next generation CDNs

Examples http://www.cotendo.com/services/DSA/

http://www.us.cdnetworks.com/dynamic_web_acceleration

http://www.cotendo.com/services/DSA/

http://www.us.cdnetworks.com/dynamic_web_acceleration


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


Questions?


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:[email protected]

m:+44 7876 680410

Twitter: http://twitter.com/AppPerf

LinkedIn: http://www.linkedin.com/in/mickmcguinness

Skype: mick_mcguinness

http://twitter.com/AppPerf

http://twitter.com/AppPerf

http://www.linkedin.com/in/mickmcguinness

http://www.linkedin.com/in/mickmcguinness

performance automation 101 @ldnwebperf mickmcguinness

Documents