Lighthouse is a tool used by web developers to measure how fast and following best practices the website is. You can run it from your chrome developer tool or run it online. Lighthouse gives you four scoring categories and the score is divided into red, yellow, and green scale. Creating a site that achieves a green score is hard, but maintaining the Lighthouse score is harder. That's why many services aim to help you keep track of your web performance.

In this post, I'll introduce you to an open-source project Speedlify by @zachleat and how to run it for free using GitHub Actions.

Speedlify

Speedlify helps you automate Lighthouse running and generate a dashboard for you. You can have a look at the dashboard for my website for an example.

Speedlify also provides speedlify-score, a web component that lets you embed the score to your website. I have embedded it at the bottom of my homepage.

GitHub Actions

Unlike running with Netlify which limits your build time, my workflow utilizes a generous free unlimited build time for a public repository. You can monitor hundreds of websites for free!

Code

An example code is in ThewApp/speedlify-actions repository. You can follow usage steps in the repository README. I have also submitted this repository to #actionshackathon .

The main workflow file that automates the Lighthouse with Speedlify is at .github/workflows/test-pages.yml. It runs Lighthouse on each site after checking if the configured frequency has passed every hour. The results are stored on the results branch in the same repository. It also uploads full results as artifacts that you can download later.

There is another workflow file that automatically deploys the dashboard to GitHub Pages. The dashboard will be updated 1 hour after Lighthouse has run. But you can update it manually at any time by triggering workflow_dispatch event.

If you would like to deploy to other hosting providers, I have created another example that deploys to Vercel.

Feel free to reach me if you need any help.