Adding Lighthouse scores to my site's footer | Zach Leat

...as a performance advocate, I feel that it’s important to keep myself honest and to have some transparency behind the sites I build.

Using a combination of Speedlify and Google Lighthouse tool, Zach is able to display web performance scores in his footer, bespoke for each page. He seems to be doing so client-side, though I don't fully understand the reasoning. He's using 11ty, so there's a build process involved. Zach points out that the Lighthouse score would be "stale" if pulled in during build time but that doesn't feel right. I'd expect the Lighthouse score of a static page to be constant until that page was updated, which would require another build anyway. I guess if he's doing a lot with client-side JS that may not be the case 🤷‍♂️ I also admit that he is the web perf specialist and I am not, so I am likely missing something.

Either way, it's a cool feature and a neat example of API-driven, Jamstack goodness 👍

Explore Other Notes

Older ➑

Preload page links on hover

Gatsby's page-fetching is a feature I consider a double-edged sword (though I'll admit I also don't fully understand it 😅). On the one hand, I'm all for anything that decreases load time […]
  • Using a combination of Speedlify and Google Lighthouse tool, Zach is able to display web performance scores in his footer, bespoke for each page. He seems to be doing so client-side, though I don't […]
  • Murray Adcock.
Journal permalink

Made By Me, But Made Possible By:

CMS:

Build: Gatsby

Deployment: GitHub

Hosting: Netlify

Connect With Me:

Twitter Twitter

Instagram Instragram

500px 500px

GitHub GitHub

Keep Up To Date:

All Posts RSS feed.

Articles RSS feed.

Journal RSS feed.

Notes RSS feed.