As the Yahoo! performance team have been saying for some time, when looking to improve loading times on your website, you should “optimize front-end performance first, that’s where 80% or more of the end-user response time is spent”. Poor hosting and slow back-end content management systems aside, the front-end is where you can make some quick wins and see real improvements in the user experience.

Analysing your current site

The Webpage Analyser and Yslow for Firefox are inevitable starting points. Expect a low grade from YSlow, which by default will score heavily designed sites and those without CDNs poorly. You can tweak the configuration to suit the constraints of a given project. For instance, if your client hasn’t access to a Content Delivery Network, set YSlow to ignore that rule. Google Page Speed is another good add-on for Firefox, and Speed Tracer is a similar tool with a nice interface, available as an extension for Chrome.

While a greater number of users are on broadband, many will have only 1 or 2 megabit connections, far slower than the 10MB you may have at the office. This is why it’s always worth emulating different connection speeds, to see exactly what your users are experiencing. Firefox Throttle is a very handy extension which allows you to throttle your connection speed, even for locally hosted sites.

Once you’ve got some idea of the page load speed, you’ll need some suggestions for how to improve that YSlow score. Yahoo maintains a comprehensive set of rules, which is well worth a read.

Tags: optimisation