Tip of the Day: Automate Google Lighthouse Tests on Your Netlify Build Pipeline
Google Lighthouse is an automation tool for auditing and improving the quality of web pages. Measured metrics include performance, accessibility, SEO, and best practices. It also has a CLI app for command line automation.
With the goal of automating all my workflows, I wanted to combine my site’s Lighthouse audits with a local build and testing pipeline. Fortunately, Netlify also offers a CLI that replicates the hosted build process and can deploy to obfuscated URLs for previewing and testing sites.
Instead of pretty-printing the output, the Netlify CLI can be flagged to output to JSON.
With a little help from the fantastic
jq (a lightweight and flexible command line JSON processor), we can create a pipeline that automatically performs the following:
- Builds the site using Netlify
- Deploys the site to a Netlify preview URL
- Processes the JSON output to extract the
- Runs a Google Lighthouse audit on the given URL
From the command line, it simply looks like this:
lighthouse --view $(netlify deploy --json | jq -r ".deploy_url")
Broken down, we have:
lighthouse --view: runs a Lighthouse audit on the given URL
netlify deploy --json: deploys the current directory to a preview URL, does not pretty-print any output, and outputs the deployment data as JSON
jq -r ".deploy_url": processes the incoming JSON string, extracts the value of the
deploy_urlkey, and outputs raw strings
This website’s repository contains a
Makefile that uses the above process in a production setting.