As the Lighthouse project evolves, Foo will continue to utilize its maximum potential and stay up to date with new versions. Lighthouse 10 introduced interesting and pretty major changes that this post intends to summarize. Most notable changes include updates that have yielded an improvement to performance scores of many 🙌!
Lighthouse 10 Score Improvements Proven
At Foo, we run Lighthouse automatically thousands of times a day. We crunched the numbers of all pages registered with Foo and the results of score changes between Lighthouse 9 and 10 are quite positive! We extracted data from approximately 1,300 URLs by taking the average performance score of each over the last 10 runs before the version update from Lighthouse 9 to Lighthouse 10 and the average of the first 10 runs after... leading to the average difference in performance score points for each URL. We then calculated the average difference of all 1,300 URLs. Below are the results.
- Desktop average performance score change between Lighthouse 9 and Lighthouse 10: + 4.90 points
- Mobile average performance score change between Lighthouse 9 and Lighthouse 10: + 6.02 points
Lighthouse 10 Performance Audit
As Lighthouse users, most of us have dealt with frustration in battling the sometimes seemingly impossible performance audit. It seems the Google team have taken note and made interesting changes to evolve the performance audit. Below are some of the most important changes directly affecting performance score in Lighthouse 10 and up.
Lighthouse 10 Changes Summarized
In summary, below are the key changes introduced by Lighthouse version 10. Find the complete details from Google here.
- Performance metric change: Time To Interactive (TTI) metric is removed
- Performance score change: TTI's 10% score weight is shifting to Cumulative Layout Shift (CLS), which will now account for 25% of the overall performance score
- New audit:
bfcache(back / forward cache) - New audit: Paste-preventing inputs
- Node.js package update: There are some programmatic breaking changes from Lighthouse version 10 you may need to account for if you use the Node.js package. See the 10.0 changelog for full details.
- Node.js package update: Lighthouse 10 also ships with full TypeScript type declarations so that anything imported from
lighthouseshould now be typed