Web-Perf Wednesday 004 – A Quiet Week Is Time to Investigate
A quiet week in web performance is a useful chance to investigate the evidence and problems teams already have.
CSS Wizardry
– Web Performance and Site Speed Consultant
Latest posts
Web-Perf Wednesday 003 – Native SPA Metrics Have Arrived
Chrome 151 and web-vitals v6 bring native SPA measurement into production, while new browser controls reshape device and third-party governance.
Web-Perf Wednesday 002 – The Metrics Don’t Tell the Whole Story
CrUX’s seasonal decline, Safari 27’s user-experience fixes, richer INP attribution, and long-session third-party costs all demand better interpretation.
Measuring Component Performance with the Container Timing API
Measure how entire components render with the Container Timing API: how it differs from Element Timing, where it helps, and how to try it today.
Low- and Mid-Tier Mobile for the Real World (2026)
The 2026 update to my real-world device testing recommendations paints a clearer picture than ever…
Web-Perf Wednesday 001 – SPAs Are Finally Becoming Measurable
Chrome 151 brings native soft-navigation measurement closer, alongside better redirect timing, revealing CrUX data, and more trustworthy browser tooling.
Front-End’s Missing Metric: The TBT Window
The TBT Window is the FCP-to-TTI interval used to calculate Total Blocking Time. If FCP or TTI moves, TBT can change even when long tasks do not.
Meet Your Users Where They Are with Obs.js
Obs.js is a tiny inline script that helps you adapt your site to real-world network, battery, CPU, and memory conditions.
Better Browser Caching with No-Vary-Search
No-Vary-Search lets HTTP caches ignore irrelevant query parameters such as UTM tags, while still keeping meaningful ones like product variants in the cache key.
font-family Doesn’t Fall Back the Way You Think
A quick but important reminder that font-family declarations don’t inherit fallback stacks the way many developers assume.
What Is CSS Containment and How Can I Use It?
CSS containment lets you isolate layout and paint work to self-contained ‘islands’. Here’s what each contain value does and how to use it safely.
When All You Can Do Is All or Nothing, Do Nothing
If your design system can only apply `loading=lazy` or `fetchpriority=high` blindly, it may be safer not to apply them at all.
Obs.js: Context-Aware Web Performance for Everyone
Obs.js is a tiny inline script that exposes network, battery, CPU, and memory signals to CSS and JavaScript so you can adapt to user context.
Low- and Mid-Tier Mobile for the Real World (2025)
Discover the most representative low- and mid-tier mobile devices for web performance testing in 2025.
The Fastest Site in the Tour de France
How fast are pro cycling teams’ and manufacturers’ websites? A CrRRUX-powered deep dive into bike brand performance, visibility, and missed opportunities.
Making Sense of the Performance Extensibility API
Making sense—and use!—of the new Performance Extensibility API in Chrome DevTools.
Why Do We Have a Cache-Control Request Header?
Learn how the Cache-Control request header works, how browsers handle refresh and hard refresh caching, and when developers should use it themselves.
HTML Is Not a Programming Language…
Is HTML a programming language? In this short post, I explore why HTML is powerful, fundamental, and essential—but not a programming language.
Build for the Web, Build on the Web, Build with the Web
What is the real, long-term cost of adopting a JavaScript framework?
Licensing Code on CSS Wizardry
I’ve recently decided to apply the permissive MIT License to all content on CSS Wizardry by default. How does this affect you?
A Layered Approach to Speculation Rules
The new Speculation Rules API is incredibly powerful, but we can do so much more! By taking a layered approach, we can add more progressive functionality.
Designing (and Evolving) a New Web Performance Score
Why design another new performance score?! Good question…
Core Web Vitals Colours
If, like me, you frequently require the Core Web Vitals colour palete, here it is!
The Ultimate Contract Templates for Tech Consultants: Protect Your Business and Get Paid
If you want to start consulting, you’re gonna need some paperwork!
Optimising for High Latency Environments
We can’t do much to change latency, so how can we work around it?
Cache Grab: How Much Are You Leaving on the Table?
Quantifying the importance of caching just got a lot easier
blocking=render: Why would you do that?!
Why on earth would you make something render-blocking?!
Correctly Configure (Pre) Connections
We’re probably familiar with preconnect, but are we getting it right?
The Three Cs: 🤝 Concatenate, 🗜️ Compress, 🗳️ Cache
We know we should do it, but do we know how?
What Is the Maximum max-age?
How long?! RFC9111 lets max-age reach 68 years—far beyond the usual one that developers set. Here are the raw numbers, the spec, and when to use it.
How to Clear Cache and Cookies on a Customer’s Device
There’s a super quick and easy way to clear cache on your customers’ devices. Are you using it yet?
The Ultimate Low-Quality Image Placeholder Technique
Can Low-Quality Image Placeholders and LCP play nicely together?
Core Web Vitals for Search Engine Optimisation: What Do We Need to Know?
There’s still a lot of misunderstanding about CWV for SEO. Let’s work it out together.
The HTTP/1-liness of HTTP/2
If HTTP/2 is so much better, why does it look so similar to HTTP/1?!
In Defence of DOMContentLoaded
Is there any reason to still measure the DOMContentLoaded event? Perhaps…
Site-Speed Topography Remapped
Revisiting and remapping my Site-Speed Topography technique for assessing web performance at large
Why Not document.write()?
We’re often told not to use document.write(), but… why?!
Speeding Up Async Snippets
Async snippets used to improve performance, but now they’re a legacy anti-pattern. How do we handle them now?
Critical CSS? Not So Fast!
Critical CSS promises faster loading, but is it worth the complexity? Learn when Critical CSS actually boosts performance or when it might slow you down.
Measure What You Impact, Not What You Influence
When implementing performance fixes, it’s imperative that you measure the right thing—but what is ‘right’?
Optimising Largest Contentful Paint
Let’s look at some more technical and non-obvious aspects of optimising Largest Contentful Paint
Measuring Web Performance in Mobile Safari
How often do you test your site in iOS Safari? Do you even know how?!
Site-Speed Topography
Learning the lay of the land
Speed Up Google Fonts
Google Fonts is fast. Now it’s faster. Much faster.
Real-World Effectiveness of Brotli
How effective is Brotli, really?
Performance Budgets, Pragmatically
If you’ve ever struggled to define performance budgets, this off-the-shelf trick is what you’re looking for.
Lazy Pre-Browsing with Prefetch
Using prefetch for fun and profit
Making Cloud.typography Fast(er)
What issues does Hoefler&Co’s Cloud.typography introduce, and how can we mitigate them?
Time to First Byte: What It Is and How to Improve It
Just how much does TTFB matter when it comes to front-end performance?
Self-Host Your Static Assets
Why is it so much better to self-host your static assets?