How to improve Core Web Vitals, a case study on how to detect and fix bottlenecks, and how we ended up with green scores, all the way.

When pushed, how do various design tools utilise the hardware they’re running on?

Learn about measuring animations, how to think about animation frames, and overall page smoothness.

When I started giving talks about SVG back in 2016, I’d occasionally hear a question I never had a great answer for.

And the debug process leading up to it.

Learn about measuring animations, how to think about animation frames, and overall page smoothness.

Images are a common source of performance bottlenecks for web applications and a key focus area for optimization.

Some folks are talking about Lighthouse scores in a way that is—in my opinion—not as forthright as it could be (intentionally or not).

Performance optimization should be about making your users happy, not about making your tools happy.

In this article, we’ll highlight how modern image formats (AVIF or WebP) can improve compression by up to 50% and deliver better quality.

CSS optimization techniques that we can apply to tackle common performance issues.

Eagerly loading images within the initial viewport—while liberally lazy-loading the rest—can improve Web Vitals while loading fewer bytes.

Why compressing images for dense screens is different, and how to serve them.

Learn about how to optimize web fonts for Core Web Vitals.

I took a real app and converted it from Styled Components to Linaria to compare the app performance of CSS-in-JS and normal CSS.

This article covers CSS-related techniques for optimizing Web Vitals.

Web fonts are often terrible for web performance. With CSS font descriptors, we might be able to solve our font loading troubles for good.

Deep-diving on the load performance of F1 websites.

Fine-tune your font files and optimise your loading strategy for maximum speed + minimum FOUT.

Learn about how cookie notices affect performance, performance measurement, and UX.