How to improve the speed and performance of a website.

It’s often said that ‘patience is a virtue’ but with the ever-evolving functionality and uses of the web it is becoming more apparent that nobody likes to wait.

There are numerous examples and stats around that enforce the importance of having a super-fast performant website. Below I’ve listed and referenced some of my recent favourites:

Tests of the new, faster FT.com showed users were up to 30% more engaged with more content being consumed
The Trainline reduced latency by 0.3 seconds across their funnel and customers spent an extra £8 million a year (Video)
A number of examples noted by Google’s DoubleClick

• 53% of visits to mobile sites are abandoned after 3 seconds
• Comparing 5 seconds to 19 seconds load time – 70% longer average session lengths, 35% lower bounce rates and 25% higher ad viewability

The resounding outcome of these case studies, A/B tests and research is that the speed of a website has drastic implications for engagement and conversion. Therefore, looking at ways to optimise your site should be at the forefront, and be considered early in any web project (not an afterthought!).

Five top tips for improving the performance of your website:

Optimising images for the web

More and more brands are utilising strong, visual designs for their web presence, and as such imagery is a large aspect of these sites. Images can also be some of the most performance hungry assets.

I could write a whole blog on image optimisation, however as some key take home points consider the following:

• Lossless image optimisation – in short this optimises the size of images, whilst maintaining image quality (there are many online resources that will optimise images for you)
• Scaling for responsiveness – due to the numerous screen sizes that are now used to access websites, images should now scale based on the screen it is being viewed on. For example, you don’t want to serve a desktop sized image to a mobile device.
• Choose the best image format – depending on the image you may want to use different formats to improve optimisation. Do you need transparency? Is there a wide colour palette? As a very rough guide:
  • JPEG – Photos, images with many colours
  • GIF – Animations
  • PNG-8 – Images with few colours
  • PNG-24 – Partial transparency

Reducing code to accelerate web performance

Code is often written in a format that makes it easier to read, utilising line breaks and spaces. While this benefits people reading the code it does mean there are a large number of unnecessary characters, and while on a couple lines of code the performance affect is negligible if we’re looking at thousands of lines it can begin to have an impact on performance.

Minifying is the process of removing all the unnecessary characters and therefore reducing the file size of the code. Again there are many resources online to aid in the minification process.

Leveraging caching to increase performance

Caches allows you to keep sites scalable and fast. They store copies of data and provide these when they’re next needed, reducing the number of requests that make it to the server. And as such servers can handle more users.

Browser caching is the most basic form of this that is widely used. This prevents users from repeatedly downloading the same assets when they revisit pages on your site, so fewer requests to web serves equally more capacity to handle more users.

Browser caches are not shared between users however so they don’t help with scalability of a solution, i.e. if 10,000 users hit the site that’s still 10,000 individual caches to fill. In this example, you would want the website to have its own cache.

Finally, there are CDNs, which are the essentially the next step on from website caches. In simple terms, they are used as a large cache that can store content to serve to users without the need to access your servers, great for content that is not updated often. The added bonus is CDNs allow content to be distributed worldwide so your website can be just as fast internationally as it is domestically.

How redirects can affect web performance

Redirects generate additional round trip times (RTT) and therefore double the time required to load the initial HTML document before the browser even starts to load other assets. As such if redirects can be avoided, they should be.

Don’t compromise on server speed and page weight

Any site under heavy load will slow down, web servers and databases will be doing a range of things at the same time and this will cause performance to drop. You’ll see this every year around peak trading times, for example Black Friday sales.

To mitigate the impact on customers, consider compromising on aspects of the website. If you have database intensive feeds that run on the site, maybe consider turning these off during your peak trading hours. It’s a question of prioritising the functionality of your site, and a lot of research suggests speed should be at the top of this list.

Expanding on the point above it’s essential to ensure that your infrastructure is up to the job at hand. If you have traffic data, analyse this; determine what kind of infrastructure you need to support your solution.

Why it’s essential to speed-up your website

With the evolution of technology, we are in a wonderful time where you can purchase products or services, find out the full filmography of Harrison Ford or the answer to that darned pub quiz question about flags (I do not condone cheating) within seconds with virtually no effort.

The thought of having to wait for information or a response is starting to become alien. And as such the importance of a time efficient service is becoming a key driver for engagement, brand loyalty and ultimately conversions within a web environment.

Technology has enabled us to speed up our lives. Patience is, now more than ever, a virtue.