{"id":57383,"date":"2022-10-28T20:42:22","date_gmt":"2022-10-28T17:42:22","guid":{"rendered":"https:\/\/themeisle.com\/blog\/?p=57383"},"modified":"2023-12-03T16:58:48","modified_gmt":"2023-12-03T14:58:48","slug":"pagespeed-insights-vs-lighthouse","status":"publish","type":"post","link":"https:\/\/themeisle.com\/blog\/pagespeed-insights-vs-lighthouse\/","title":{"rendered":"PageSpeed Insights vs Lighthouse: Which is Better for Tracking?"},"content":{"rendered":"\n

Tracking your site\u2019s performance is crucial. It can help you identify weak areas and take the necessary steps to improve them. However, you might feel torn between two popular performance-monitoring tools: PageSpeed Insights<\/strong> vs Lighthouse<\/strong>.<\/p>\n\n\n\n\n\n\n\n

Fortunately, we\u2019ve put together a guide to help you make a decision. By looking at how these two tools fare in different areas, you should be able to select the one that best meets your needs. <\/p>\n\n\n\n

Overall, the tools share a lot of similarities. It’s because PageSpeed Insights’ performance testing engine is based on Lighthouse.<\/p>\n\n\n\n

However, there are also some key differences between the tools and each gives you access to different information, despite the performance part being based on the same engine.<\/p>\n\n\n\n

In short, PageSpeed Insights presents the Lighthouse data in a different way. It also gives you access to data beyond the Lighthouse analysis, such as real user data from the Chrome User Experience Report. At the same time, Lighthouse also presents some data that PageSpeed Insights doesn’t include, such as reports on SEO and accessibility.<\/p>\n\n\n\n

\ud83d\udc49 In this post, we\u2019ll compare PageSpeed Insights vs Lighthouse<\/a> across three key features. We\u2019ll also share some tips to help you choose the right tool for your website. Let\u2019s get started!<\/p>\n\n\n\n

\ud83d\udcda Table of contents:<\/h4>\n\n\n\n
    \n
  1. How do you run a test? Ease of use<\/a><\/li>\n\n\n\n
  2. Where does the data come from?<\/a><\/li>\n\n\n\n
  3. What reports and metrics can you access?<\/a><\/li>\n<\/ol>\n\n\n\n\t\t
    <\/div>\n\t\t\t
    \n\t\t \t
    \n\t\t \t\tTracking site performance: #PageSpeed Insights vs #Lighthouse \ud83d\udcc8\ud83d\udcc9<\/a>\n\t\t \t<\/div>\n\t\t \t
    \n\t\t \tClick To Tweet \n\t\t \t\t<\/span>\n\t\t \t<\/a>\n\t\t <\/div>\n\t\t<\/div>\n\n\n
    <\/div>\n\n\n\n

    PageSpeed Insights vs Lighthouse: Three key features compared<\/h2>\n\n\n\n

    Before we start, \ud83c\udfc1 it\u2019s worth mentioning that both PageSpeed Insights (PSI)<\/a> and Lighthouse<\/a> are available for free.<\/p>\n\n\n\n

    Lighthouse is an open-source auditing tool created by Google that comes built into Chrome and most other Chromium-based browsers. PageSpeed Insights is also a Google tool and can be accessed on any browser. <\/p>\n\n\n\n

    Let\u2019s take a closer look at \ud83d\udd0e these two online tools and how they compare in different areas:<\/p>\n\n\n

    <\/div>\n\n\n\n

    1. How do you run a test? Ease of use<\/h3>\n\n\n\n

    If you plan to run regular speed tests, you\u2019ll want a user-friendly tool \u2699\ufe0f with an intuitive interface. In this section, we\u2019ll compare PageSpeed Insights vs Lighthouse for ease of use:<\/p>\n\n\n\n

    PageSpeed Insights<\/h4>\n\n\n\n

    PageSpeed Insights is relatively easy to use. To get started, simply enter your URL into the box and hit Analyze<\/em><\/strong>:<\/p>\n\n\n

    \n
    \"PageSpeed<\/figure><\/div>\n\n\n

    It will then generate two reports: one for your desktop site and one for the mobile version. You can click on either tab to view your performance on these devices:<\/p>\n\n\n

    \n
    \"PageSpeed<\/figure><\/div>\n\n\n

    The tool will instantly tell you whether you\u2019ve passed or failed your Core Web Vitals<\/a> test (assuming your site is receiving enough traffic to be included in the Chrome User Experience Report – more on that in a second<\/em>).<\/p>\n\n\n\n

    PSI also breaks down each metric to demonstrate how your site performs in specific areas. We\u2019ll take a closer look at these metrics and what they mean later in the post.<\/p>\n\n\n\n

    If you scroll down, you should see an overall performance score:<\/p>\n\n\n

    \n
    \"PageSpeed<\/figure><\/div>\n\n\n

    Anything above 90 indicates a fast-loading site. An orange score (50-89) means that your page has relatively good loading times, but you may need to make adjustments to improve its performance. Finally, a red score (anything below 49) means that your site takes a long time to load on this device, and you\u2019ll need to do a bit more work. <\/p>\n\n\n\n

    Once again, you\u2019ll receive a breakdown of the metrics on which the performance score is based. You\u2019ll also get easy access to diagnostics and suggestions for improving each metric (we\u2019ll talk more about these later).<\/p>\n\n\n\n

    Lighthouse<\/h4>\n\n\n\n

    Now, let\u2019s turn to Lighthouse. As mentioned earlier, this tool was also created by Google, so you might notice some similarities. <\/p>\n\n\n\n

    To access Lighthouse, open Chrome and press the F12<\/em> key to launch the Developer tools<\/em><\/strong>:<\/p>\n\n\n

    \n
    \"Developer<\/figure><\/div>\n\n\n

    Then, click on the tab with two arrows and select Lighthouse<\/em><\/strong>:<\/p>\n\n\n

    \n
    \"Accessing<\/figure><\/div>\n\n\n

    Next, you\u2019ll be asked to select some options for your report:<\/p>\n\n\n

    \n
    \"Generating<\/figure><\/div>\n\n\n

    \ud83d\udc49 For example, you might choose to check your site\u2019s accessibility or search engine optimization (SEO)<\/a> only. You can also select the device you want to test your site on. When you\u2019re ready, click on Analyze page load<\/em><\/strong>.<\/p>\n\n\n\n

    Lighthouse will then generate a report based on your selected categories. You\u2019ll see a score for each area: <\/p>\n\n\n

    \n
    \"Lighthouse<\/figure><\/div>\n\n\n

    You can click on any category for a more detailed report:<\/p>\n\n\n

    \n
    \"Accessibility<\/figure><\/div>\n\n\n

    If you select Performance<\/em><\/strong>, you\u2019ll notice that the report is similar to the one generated by PageSpeed Insights. Again, this is because PSI uses Lighthouse as its analysis engine:<\/p>\n\n\n

    \n
    \"Lighthouse<\/figure><\/div>\n\n\n

    You\u2019ll get a score for each Core Web Vitals metric, plus a list of suggestions for improvement. Depending on your performance, you\u2019ll also find tips for other categories, including SEO<\/em> and Best Practices<\/em>.<\/p>\n\n\n\n

    Lighthouse lets you save a copy of your report. To do this, click on the three dots near the top and select your preference:<\/p>\n\n\n

    \n
    \"Printing<\/figure><\/div>\n\n\n

    As you may have noticed, Lighthouse requires a bit more user input. Also, you\u2019ll need to run separate tests for your desktop and mobile sites, whereas PageSpeed Insights lets you compare both reports with minimal effort. <\/p>\n\n\n

    <\/div>\n\n\n\n

    2. Where does the data come from?<\/h3>\n\n\n\n

    The available data sources \ud83d\udcbe are one of the biggest differences between PageSpeed Insights vs Lighthouse.<\/p>\n\n\n\n

    PageSpeed Insights offers two types of data:<\/p>\n\n\n\n