In 2018, Google released a huge update to the scoring factors within PageSpeed that you may have heard about, but may not fully understand. It’s known as Google Lighthouse, or Google PageSpeed Insights v5, and despite being released very lowkey by the search giant it made waves. So we’re going to run you through what we’ve learnt about it since its release.

Google Lighthouse
Google Lighthouse

What is Google PageSpeed Insights version 5, AKA Google Lighthouse?

Prior to the launch of Lighthouse, PageSpeed operated off a number of metrics most of us working in the field were across. These include the following:

  • Leveraging of Browser Caching: The end user’s cached files allowed faster loading of pages already visited. Most of us with computers would be decently across the cache. It’s what we clear when things aren’t working.
  • Server Response: To score for this factor, Google expected a response time from your website’s server of 0.2 seconds. That’s fairly unachievable with shared hosting on cheap accounts.
  • Optimisation of Images: If your site was loading images far larger than needed, resulting in slower downloads and more bandwidth use for your end users, Google looked poorly on you and scaled you down. Some sites have seen huge increases in their score just by optimising their images.

But what does all this have to do with Google Lighthouse? Until, this update made Lighthouse a default analysis type, it was more of an optional optimisation method – because it was an open-source tool that imed to improve quality rather than score rankings – that only a few website managers had made much use of because they all focussed on the 20 known metrics like those above.

Now that it’s embedded, everyone needs to get across it. It introduces around 20 or so new metrics. Once the wider internet is building websites using these methodologies, we’ll all be in for a faster, more fluid browsing experience. And the sites that get on it early and do it well will benefit from increased SERP results.

 

What are some of the key metrics introduced as part of Google Lighthouse?

We’ll start with one that is a fairly simple and obvious thing to change straight away: deferring offscreen image loading. This can be done yourself using lazy loading libraries if you’re a techhead or you have an agency like Wolf helping you through it. If not, you can find less technical ways, such as WordPress plugins that should walk you through it. Just this one improvement can see huge increases in your Lighthouse metrics scoring on PageSpeed.

Whilst we’re on images, you should also focus on the web image formats now preferred by Google. Whilst it can be a lot of work and pain, because one like JPEG2000 has seen loads of compatibility issues, Lighthouse does punish you for not doing it.

Next we’ll look at another defer option: that of unused CSS. A lot of developers neglect the CSS that builds the website, meaning it’s messy, hard to maintain, and looked at poorly by Google. Improving the code running in the background should be a priority because Google will mark you down if you don’t, as it slows loading speeds and adds bandwidth for users unnecessarily.

Finally, though not the last of what you need to look at, is the JavaScript parsing time element. This is a bit more in depth than the other tips, but may be one of the most important – and best, to be fair – changes in version 5, or Lighthouse. Before Lighthouse, if you tightened your JavaScript so it didn’t block your page’s rendering, Google was relatively happy with you.

 

Now, you need to be looking at some of the below because, well, Google certainly is:

  • Remove unused code
  • Compress the code you are using
  • ‘Minify’ your code
  • Make sure the only code being sent to your end users is what is necessary for the page.

Now, just in case you’re asking, to minify your website’s code means to minimise characters used. So on top of removing all unnecessary blocks of coding, like empty space, you should also remove all unnecessary characters within a block of coding. Just make sure you know what you’re doing, so that the characters you remove don’t completely change what your website is doing!

 

What does Google say about it all?

For Google’s part, they give developers a run through list of how to approach the new age of PageSpeed analysis, including through a helpful Chrome extension. They write on their dedicated page: “Lighthouse is an open-source, automated tool for improving the quality of web pages. You can run it against any web page, public or requiring authentication. It has audits for performance, accessibility, progressive web apps, and more.”