If you’ve ever performed or received a site speed audit, you’ll know that common ways to increase page load time include optimising images, leveraging browser caching and enabling compression.

However, most audit tools only scratch the surface of possible improvements. If you dig deeper, you’ll unearth plenty of opportunities that could noticeably boost page performance, both in terms of site speed and SEO.

Re-think your image optimisation approach

If your site is full of PNG images, especially logos, consider switching to SVGs instead. SVGs are vector images and can bring considerable savings of up to 60 per cent when it comes to file sizes.

Even so, the small file sizes of SVG icons will probably fly under the radar of most site speed audits. But the trick is not to simply compress them and leave it at that, but to deliver your images in a different way too…

For example, images can be inlined in the same way as bits of CSS or JS, which is often recommended as site speed best practice. Even a very small image file requires a complete round trip to the server and back, which can have a big impact on site speed.

So, along with using SVGs rather than PNGs, consider inlining small images to bring outsized performance gains.

Wave goodbye to JavaScript; say hello to HTML

Given the popularity of JavaScript libraries providing off-the-shelf solutions, several sites now use this programming language for functionality that could be achieved elsewhere. This means there’s more to download and more trips to the server as well as greater execution times and costs.

Much JavaScript’s functionality can be achieved with HTML or CSS. For example, dropdown boxes with a text search option are now available out of the box with the HTML datalist element.

You’ll still retain the same functionality in addition to a seamless user experience and a native interface on smartphones.

So, examine the functionality of your site and see where there may be opportunities to reduce your reliance on large JavaScript libraries where native HTML/CSS options are a viable alternative.

Networking tune-ups FTW

Whenever a user’s browser has to collect resources from the server, it must send a message across the internet and back, the speed of which is limited by the speed of light. And while there’s no way of influencing or changing this, it does mean that even small requests add time to the page load.

Therefore, it’s important to find ways to either reduce the distance of these requests or to reduce the number of round trips required. Although technical, the following tactics can deliver big wins:

  • TLS 1.3 – TLS (or SSL) is the encryption technology used to secure HTTPS connections. The recently defined TLS 1.3 offers a significant speed improvement for new connections by reducing round trips to just one.
  • QUIC & HTTP 3 – Several sites have moved from HTTP 1.1 to HTTP 2 in recent years for site speed improvements. But an emerging pair of standards known as QUIC & HTTP/3 further optimise the connection between the browser and the server, further reducing the round trips required.
  • Super routing – If you’re on CloudFlare or AWS, then there is the potential to enjoy gains from simply flipping a switch to turn on smart routing features. Essentially this means giving users their own private access road to your server.

Make CSS do the heavy lifting

As well as leveraging HTML’s built-in functionality to reduce your reliance on heavy pieces of code, you can also take advantage of the ever-capable CSS in the following ways:

  • Reuse images – From variations of a logo in different colours to arrows pointing in different directions, you can use CSS’s transform functionality to display the same image in different ways, thus eliminating a round trip to the server.
  • Interactions – Certain navigation elements such as menus and tabs are implemented in JavaScript. However, these can be done in pure CSS with the greatest of ease.
  • Animations – CSS3 animations are not only faster than JavaScript versions, they can also be a lot smoother because they run in the native code of the operating system.

Even if you don’t find these examples useful or actionable, the most important thing to remember is that site speed improvements can be found throughout your site’s architecture, no matter how small they may be.

Of particular significance is reducing the number of round trips needed to the server, as even small assets take time to fetch and can have an adverse impact on performance.