How to analyze website performance with Lighthouse

Audit website performance manually, programmatically, or automatically

Adam Henson
Apr 11, 2019 · 4 min read
Image for post
Image for post
Cityscape Birds Eye View

You give Lighthouse a URL to audit, it runs a series of audits against the page, and then it generates a report on how well the page did. From there, use the failing audits as indicators on how to improve the page. Each audit has a reference doc explaining why the audit is important, as well as how to fix it. Lighthouse

There are many reasons why you’d want to measure performance, but one of the most important is about the impact on SEO. I go into more detail about this and how to address certain metrics in this article.

Running Lighthouse with Chrome DevTools

You can run performance audits manually with the Chrome DevTools browser extension. Simply fire up the extension from the web page you’d like to test and select the “Audits” panel.

Image for post
Image for post
Chrome DevTools “Audits” Panel
Image for post
Image for post
Lighthouse Performance Report

Running Lighthouse Programmatically

For our standard “run of the mill” situations, the above should suffice. Another way to run Lighthouse involves installing the open-source package via NPM and following the instructions in the CLI documentation. This can be beneficial if you want to run audits programmatically in a build pipeline, for example.

Running Lighthouse Automatically Over Time

So now that we’re pros — let’s take this to the next level. There are many integrations listed in the Lighthouse documentation, so let’s take a look at one of them.

Using Foo’s “Automated Lighthouse Check” to Run Lighthouse and Compare Results Over Time

In an engineering setting where many developers are deploying application changes on a regular basis, it can be important to monitor website performance over time to associate change sets with performance degradation or improvement. Another example would be teams that have initiatives to improve performance for SEO ranking or other reasons. In these situations, it’s critical to monitor website performance over days, weeks, months, etc.

Image for post
Image for post
Amazon Example Lighthouse Timeline Chart

Conclusion

Lighthouse is becoming an industry standard in website performance measurement. There are books worth documentation about Lighthouse that provides details of important metrics.

freeCodeCamp.org

This is no longer updated.

Medium is an open platform where 170 million readers come to find insightful and dynamic thinking. Here, expert and undiscovered voices alike dive into the heart of any topic and bring new ideas to the surface. Learn more

Follow the writers, publications, and topics that matter to you, and you’ll see them on your homepage and in your inbox. Explore

If you have a story to tell, knowledge to share, or a perspective to offer — welcome home. It’s easy and free to post your thinking on any topic. Write on Medium

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store