Thursday, 28 November 2013
Optimising web site performance with page speed
If you haven’t measured the performance of your web pages, then you MUST and given that it’s so easy to measure and improve then it’s criminal if you don’t.
You can measure performance in most browsers, however let’s look at you can do it with chrome - note that firefox usage is pretty similar if you install the pagespeed addon.
- Open you page in chrome browser.
- Click menu view / developer / developer tools
- Click on the Audit tab in the developer tools window.
- Click Run.
- Step through each of the audit report items in turn and address the significant ones you can.
Depending on your web server you use, you may be interested in modpagespeed (Apache), ngx_pagespeed (Nginx) or IISpagespeed (IIS - not personally verified) to help address some the items reported in the page speed audit.
Typical items you may want to address from the report include :
- Resource caching - resources (images / CSS / JS) don’t tend change much, so it’s good to implement an appropriate cache policy by setting appropriate HTTP headers.
- Enable GZIP compression - most browsers, devices now support GZIP compression. Compressing content to be sent over HTTP, even with the overhead of compression and decompression on server and client side, so this is often valuable optimisation.
- Optimise images - large high resolutions images can be quite a significant part of the pay load. Sometime these can be compressed without loss, sometimes you may want to reduce the size for smaller screens.
With any of these changes ideally you’d follow a test driven approach -
observe the problem, measure the improvement of the fix and include such
verification in test scripts so you have ongoing monitoring the optimisations.
Try not to make blind changes in the hope that performance is improved, since you don’t want to make change that make insignificant changes (or even worse) have an adverse effect.