Google’s PageSpeed Insights (PSI) is the most popular speed testing tool out there for gauging web performance. Unfortunately, its results are easy to misinterpret, especially if you’re using it for the first time.
In this post, I’ll explain exactly how to interpret a PageSpeed Insights report from top to bottom.
Before we get into the details, let’s start with one vital question.
This is the first thing you should ask yourself when working with any speed testing tool.
For the optimization score and the Lab Data section, PSI runs a test on a predetermined device and network settings. Based on this test, PSI computes the lab metrics, which in turn make up the optimization score.
With that in mind, let’s dive a little into each section.
The optimization score is usually what people focus on in PSI.
The score simplifies performance by making things binary. Green is good, red and orange aren’t. It’s a useful heuristic, especially for newcomers.
However, as I said, the score doesn’t take into account real-user metrics. This is a problem, since a green score looks good, but that doesn’t necessarily mean a page is fast for visitors.
That said, the score is still valuable. You can only reach the coveted green result by implementing best practices like keeping the site’s code clean, caching, optimizing images, and removing render-blocking resources.
These techniques improve your lab metrics and tend to have a positive impact on the actual user experience.
That’s why you can use the score to somewhat gauge if a page’s performance is trending in the right direction.
The Opportunities and Diagnostics sections in the Google PageSpeed Insights report are a goldmine of speed optimization tips, techniques and best practices.
Explaining all of them would take a few articles, but it’s worth mentioning the must-haves for any site.
Image files are often huge compared to other resources. Also, most users don’t even look at every image on a page. That’s why serving all images to the browser at once is a waste of resources.
Deferring (lazy loading) offscreen images makes sure they’re loaded only when someone needs them. This technique can massively reduce initial page load time. Lazy loading also helps the browser prioritize the loading of critical images, like those above the fold.
Another big win in terms of image optimization is to serve next-gen formats. These formats have great compression and quality characteristics. Put simply, they can be smaller in size while keeping a comparable quality with older formats like JPEG.
Popular modern formats are JPEG 2000, AVIF and WebP. Currently, only WebP has enough browser support to be viable for most website owners. However, note WebP is still not fully supported by Safari and Internet Explorer (at least as of mid-2021). If that’s an issue, you should keep a JPEG version and serve it as a backup to these browsers.
Third-party scripts can sometimes prevent your own scripts from executing on time. They also increase the amount of code that has to be executed, leading to increased resource consumption and slow load times.
Consider which scripts provide the most value to the user and prioritize them.
This is a common problem for WordPress and other CMS sites since they rely heavily on third-party plugins. Choose plugins carefully and monitor their effect on your site’s performance. Always keep in mind that each tool, plugin and library adds overhead to your server.
Caching is perhaps the most important technique for improving web performance. Caching means storing a copy of your site’s resources in a separate location than your origin server. That could be directly on the user’s device (via browser caches) or on a server that’s closer to the user (via Content Delivery Networks).
A lot of resources can be cached for a long time. For example, logos, downloadable files, images and even fonts. Caching dynamic content is also possible, but it takes more effort. If you’re just starting out, consider getting a caching tool to automate most of the work for you. There are tons of caching solutions for popular platforms like WordPress.
Understanding and learning SEO methodologies that'll help your site rank for relevant terms isn't a job for the faint of heart - and those who can do this are in high demand today. Learn all about the future of SEO and the Google Page Experience update.
Again, the data here is collected from real users. It shows their experience on your site, which is the only thing that matters.
The four field metrics you can find here are:
You can find the percentage of page loads that met the criteria for each metric in the bar below its name.
Lastly, don’t worry if PSI doesn’t provide a field data report for a page. This is common for new pages or low-traffic sites.
Implement the tips from the Opportunities and Diagnostics sections as well as other best practices. As your site grows, PSI will eventually provide a Core Web Vitals report and you’ll see the true impact of these optimizations on the user experience.
Just remember that the goal of web performance is to improve page experience for real people. If your lab scores look good, but the field metrics are in the red, you still have work to do.
A crucial thing to remember about web performance is that it’s not a “one and done” type of deal. It’s a process that takes time and continuous effort.
That’s why it’s essential to test important pages regularly. Doing so ensures you spot performance issues early and react accordingly.
Also, Google determines whether a page passes the Core Web Vitals evaluation for the previous 28-day period. You should use PSI at least once a month.
Another good way to keep track of your site’s field data is the new Core Web Vitals report in Google Search Console.
It provides information about collections of pages with common Core Web Vitals problems. It’s an easy way to find issues that affect large portions of your site.
While Google’s speed testing tools are definitely useful, they’re not the only game in town. Other, more advanced tools provide a broader view of your site’s performance.
For example, WebPageTest lets you test from various locations, devices and network connections. This can help you understand how different users could potentially experience your site.
Besides that, you can find tons of other useful information, like waterfall charts, processing breakdowns and others.
Again, this is only lab data, so take it with a grain of salt. Nothing can fully replace field metrics and you should continue optimizing your site until there’s a tangible improvement in the real-user metrics.
Finally, make sure to monitor your site’s performance after changing something in its code or adding third-party plugins, tools, or libraries. These changes often create speed issues, which can remain undetected for a long time.
Subscribe to our newsletter for the most up-to-date e-commerce insights.
