custom-audit

Basic Custom Audit Recipe

Tip: see Lighthouse Architecture for information on terminology and architecture.

What this example does

This example shows how to write a custom Lighthouse audit for a hypothetical search page. The page is considered fully initialized when the main search box (the page's "hero element") is ready to be used. When this happens, the page uses performance.now() to mark the time it took to become ready and saves the value in a global variable called window.myLoadMetrics.searchableTime.

The Audit, Gatherer, and Config

• searchable-gatherer.js - a Gatherer that collects window.myLoadMetrics.searchableTime from the context of the page.

• searchable-audit.js - an Audit that tests whether or not window.myLoadMetrics.searchableTime stays below a 4000ms threshold. In other words, Lighthouse will consider the audit "passing" in the report if the search box initializes within 4s.

• custom-config.js - this file tells Lighthouse where to find the gatherer and audit files, when to run them, and how to incorporate their output into the Lighthouse report. This example extends Lighthouse's default configuration.

Note: when extending the default configuration file, passes with the same name are merged together, all other arrays will be concatenated, and primitive values will override the defaults.

Run the configuration

Run Lighthouse with the custom audit by using the --config-path flag with your configuration file:

lighthouse --config-path=custom-config.js https://example.com