Unsure about the difference between PageSpeed Insights vs Lighthouse and which testing tool you should use to audit and improve your WordPress website?
These two tools are connected, yet slightly different, which can make it confusing to figure out how they work. We're here to demystify the differences to help you understand:
- What Lighthouse and PageSpeed Insights do.
- The differences between PageSpeed Insights vs Lighthouse.
- Which tool you should use (or whether you should use both).
- How to improve your performance scores in both PageSpeed Insights and Lighthouse.
Let's dig in, starting with some basic introductions to these two tools.
What Is Lighthouse?
We're going to start by introducing Lighthouse because Lighthouse plays a role in understanding PageSpeed Insights.
Lighthouse is an open-source, automated testing tool from Google that aims to improve the quality of websites. It audits a variety of different areas including:
- Performance - this is the same test that PageSpeed Insights uses, which is why the two tools are connected.
- Accessibility
- SEO
- Best practices - this includes various issues such as HTTPS usage and correct image aspect ratios.
- Progressive web apps - this will only be visible if you've created a progressive web app version of your site.
You can see that Lighthouse is not just for performance testing, though it does include dedicated performance testing as one of its audits.
Lighthouse will give you a score out of 100 for each category, along with recommendations (called "audits") for how you can improve the score for each category. Below, you can see the scores for the four main categories along with some suggestions to improve the accessibility score:
Because Lighthouse is an open-source project, there are a lot of different ways that you can use Lighthouse to test your website:
- From Chrome Developer Tools in the Lighthouse tab.
- Using Google's web.dev site (pictured above) or another web-based Lighthouse tool like DebugBear.
- From the command line.
For example, here's how it looks in Chrome Developer Tools:
What Is PageSpeed Insights?
PageSpeed Insights is a performance analysis tool from Google. It's very easy to use - you just go to the PageSpeed Insights page, plug in your site's URL, and Google will analyse both its desktop and mobile performance.
Like Lighthouse, you'll also get an overall performance score (out of 100), along with suggestions on how you can optimise your site for performance.
However, Google PageSpeed Insights presents two types of data:
- Lab data - this is simulated test data based on the Performance report from Lighthouse.
- Field data - this is real data about how your site performs (pulled from people using the Chrome browser via the Chrome User Experience Report). You will only see this if your site has enough traffic for PageSpeed Insights to generate the report. Low-traffic sites will usually only see the lab data.
For lab data, you'll get the same six performance metrics as the full Lighthouse Performance report:
- First Contentful Paint
- Speed Index
- Largest Contentful Paint
- Time to Interactive
- Total Blocking Time
- Cumulative Layout Shift
You'll also get the same suggestions from Lighthouse in the Opportunities section, along with some unique data in the Diagnostics section which isn't available in Lighthouse:
What are the Similarities and Differences Between PageSpeed Insights vs Lighthouse?
To kick off the comparison between PageSpeed Insights vs Lighthouse, let's talk about what's similar first.
The Performance report is the same because the PageSpeed Insights test is based on Lighthouse. Whether you test using PageSpeed Insights or Lighthouse, you'll see the same performance metrics and suggestions.
However, there are also some key differences:
- Lighthouse goes beyond just performance and also tests for accessibility, SEO, best practices and progressive web apps.
- PageSpeed Insights provides more detailed performance data because it also includes real user data, along with the Diagnostics section.
There are also differences in how you can run the tests. You can only run PageSpeed Insights from the PageSpeed Insights website, while you can run Lighthouse from Chrome Developer Tools, websites like web.dev, the command line and more.
Because of this, Lighthouse also gives you a little more control over configuring your test environment, especially if you have the technical knowledge to use the command line. With the command line, you can adjust the simulated connection speed and other technical details. You'll see why this can be useful in a second.
Should You Use PageSpeed Insights or Lighthouse?
In general, PageSpeed Insights is the better option if you're exclusively interested in analysing the performance/load times of your site. PageSpeed Insights includes the Lighthouse performance audit plus you can also test both mobile and desktop at once, view real-world data from Google (if your site has enough traffic), and see more diagnostic tips.
On the other hand, if you want more comprehensive data about your site including a look at details such as accessibility and SEO, then you might prefer Lighthouse.
Thankfully, it doesn't have to be an either/or decision - it's totally fine to use both PageSpeed Insights and Lighthouse.
If you're not a technical person, the easiest way to do this is to:
- Use PageSpeed Insights for performance. You'll get Lighthouse data and field data and you'll also be able to easily see results for both desktop and mobile.
- Use Google's web.dev site to run the full Lighthouse audit. You'll see the other Lighthouse metrics, along with another performance score (though web.dev's score is only based on mobile traffic).
Why Your PageSpeed Insights Score Might be Different Than Your Lighthouse Score
If you use both PageSpeed Insights and Lighthouse, you might notice that your scores are slightly different, even within the Performance audit (which is the same between both tools).
This is totally normal - so don't worry that you're doing something wrong.
There are a few reasons why your scores might be different. These reasons can get pretty technical, but we'll try to explain them in plain English:
- Test location - Different tools use different test locations. PageSpeed Insights chooses from four locations based on your current location - Northwestern USA (Oregon), Southeastern USA (South Carolina), Northeastern Europe (Netherlands), and Asia (Taiwan). However, if you run Lighthouse using Chrome Developer Tools, it will use your actual physical location for the test, which will lead to different results. Or, a different Lighthouse tool might still use a location that's different from the PageSpeed Insights locations.
- Network throttling - This gets a little technical... but different Lighthouse tests/tools might use different configurations and methods for connection speed throttling, which will lead to different scores (AKA how fast the internet speeds are - like 3G vs 4G).
- CPU performance - This is also a little technical... but different tools might use different configurations for CPU performance, which will affect the score (especially for JavaScript-heavy sites).
Additionally, it's quite common to see different numbers between the lab data (Lighthouse) and field data in PageSpeed Insights. This is because PageSpeed Insights simulates a very slow 3G connection for its lab tests, whereas most of your real visitors will have faster connections.
You can kind of think of Lighthouse's lab data as a "worst-case" scenario because it uses such a slow connection.
How to Improve Your PageSpeed Insights/Lighthouse Performance Scores
Whether you use PageSpeed Insights or Lighthouse, the synthetic performance audit will be the same. So, let's finish with a quick look at how you can improve some of the metrics in the Lighthouse audit using the LiteSpeed Cache plugin, which is available on all Krystal hosting plans and our Onyx managed WordPress hosting.
Enable Caching - Speed Up Load Times and Reduce Server Response Time
One of the biggest improvements you can make is to simply make sure you've enabled caching in LiteSpeed Cache and that it's working.
Doing this alone should result in a big reduction in all of the performance metrics including Largest Contentful Paint, Speed Index, Time to Interactive, etc. It will also help you pass the "reduce initial server response time" audit.
You can make sure caching is enabled by going to LiteSpeed Cache → Cache:
Optimise CSS and JavaScript
Lighthouse also has a lot of audits related to CSS and JavaScript issues such as:
- Minify JavaScript
- Eliminate render-blocking resources
- Reduce unused JavaScript/CSS
If you go to LiteSpeed Cache → Page Optimisation in your WordPress dashboard, the LiteSpeed Cache plugin gives you a lot of options to pass these audits and improve your scores.
In the CSS Settings tab, you can optimise your site's CSS code. The most notable options here are:
- CSS Minify
- CSS Combine
- Load CSS Asynchronously
If you see any issues with your site after enabling these, you can disable them and play around with different configurations to find one that works.
The JS Settings tab helps you accomplish the same thing for JavaScript. The most notable settings here are:
- JS Minify
- JS Combine
- Load JS Deferred (will help with the "Eliminate render-blocking resources" audit in Lighthouse)
Optimise Images
If you go to LiteSpeed Cache → Image Optimisation you can compress, resize, and convert your site's images to optimised formats. This can help you speed up load times and also pass the Lighthouse audit for "Serve images in next-gen formats".
In the Image Optimisation Settings tab, you can enable WebP conversion, which Lighthouse considers to be a "next-gen format":
For more details, check out our guide on using LiteSpeed cache image optimisation.
Use PageSpeed Insights and Lighthouse to Improve Your WordPress Site
Lighthouse and PageSpeed Insights are two tools that you can use to audit and improve your WordPress website.
PageSpeed Insights is based in part on Lighthouse but focused 100% on performance, while Lighthouse covers additional areas such as SEO, accessibility, and general best practices.
To improve how your site performs in Lighthouse and PageSpeed Insights, you can use optimised hosting like our Onyx managed WordPress hosting. Then, the LiteSpeed Cache plugin can help you improve your load times and pass most of the Lighthouse audits for issues such as server response time, code optimisation, image optimisation and more.
Do you still have any questions about PageSpeed Insights vs Lighthouse? Let us know in the comments! If you want to find out more about the personalised help that our Onyx Managed WordPress customers receive, feel free to get in touch via Live Chat.
Share this article
About the author
Darren H
I'm Darren and I'm the Senior Copywriter at Krystal. Words are what I do. Aside from writing, I play guitar and sing in my band Machineries Of Joy, work on getting my 2nd Dan in Taekwondo and seek adventure with my wife and daughter.