Lighthouse is an open-source, automated tool for improving the quality of your web apps. You can install it as a Chrome Extension or run it as a Node command line tool. When you give Lighthouse a URL, it runs a barrage of tests against the page and then generates a report explaining how well the page did and indicating areas for improvement.
Today, we're happy to announce the
1.5 release
of Lighthouse, a huge release, with over 128 PRs. Lighthouse 1.5 includes
a bunch of big new features, audits, and the usual bug fixes. You can install
it from npm (npm i -g lighthouse
) or
download the extension
from the Chrome Web Store.
New Audits
The CSS Usage Audit reports the number of unused style rules in your page and the cost/time savings of removing them:
The Optimized Images Audit reports images that are unoptimized and the cost/time savings of optimizing them:
The Responsive Images Audit reports images that are too big and the potential cost/time savings of sizing them correctly for the given device:
The Deprecations and Interventions Audit lists console warnings from Chrome if your page is using deprecated APIs or features that have interventions:
Report changes
As you've seen, we've focused on making the report less visually cluttered by adding tabular data, hiding extraneous help text, and adding new features to make it easier to navigate the data.
Emulation settings
It's easy to forget what throttling and emulation settings were used for a particular Lighthouse run. Lighthouse reports now include the runtime emulation settings that were used to create the report; a long time feature request:
More useful trace data
Lighthouse metrics like "First meaningful paint", "Time to Interactive", etc are
mocked out as User Timing measures and injected back into the trace data saved
with the --save-assets
flag.
If you use the --save-assets
flag, you can now drop the trace into DevTools or
open it in the DevTools Timeline Viewer.
You'll be able to see your key metrics in context with the full trace of the
page load.
Lighthouse Viewer
In HTML reports, you'll notice a new button with options for exporting the report in different formats. One of those options is "Open in Viewer". Clicking this button will send the report to the online Viewer, where you can further share the report with GitHub users.
Behind the scenes, Viewer gets your permission via OAuth to create a GitHub secret gist and saves the report there. Since it's done as your Gist, you maintain full control over the sharing of the report and you can delete it at any time. You can revoke the Viewer's permission to create gists under your GitHub settings.
Performance Experiment
The first version of the Performance Experiment project has landed in 1.5.0. This lets you experiment with your page load performance, interactively testing the effects of blocking or delaying assets in your critical path during development.
When Lighthouse is run with the --interactive
flag, a special report is
generated that allows interactive selection of costly page resources. The
experiment server then reruns Lighthouse on that page with those resources
blocked.
Learn more about the Performance Experiment in Lighthouse.
New Documentation
Last but not least, we've modernized the documentation at developers.google.com/web/tools/lighthouse/ and added new audit references.
That's it for now!
For all the details on the latest in Lighthouse, see the full release notes over on GitHub. As always, hit us up to report bugs, file feature requests, or brainstorm ideas on what you'd like to see next.