Latest Articles

We run Web Perf Clinic as a working notebook for the engineers who actually own the LCP graph in PageSpeed Insights on Monday morning. Every article here starts from a real production trace, a real CrUX regression, or a real Lighthouse CI budget that just broke a deploy. Our team writes for staff frontend engineers, SREs and performance-curious product folks who want fewer adjectives and more flame charts.

The 2026 INP Playbook

Since Interaction to Next Paint replaced FID as a Core Web Vital in March 2024, INP has quietly become the metric that decides whether your shipping React app is fast or merely fast on a Pixel 9. We track the long tail: how to find Long Animation Frames in real user data, how to break up 200ms event handlers without resorting to setTimeout cargo-culting, and why scheduler.yield() finally makes cooperative scheduling practical in Chromium-based browsers.

We publish step-by-step teardowns of slow INP on the usual suspects: hydration-heavy Next.js routes, Algolia-style autocompletes, and dashboards that re-render on every keystroke. Expect annotated DevTools Performance traces, before/after RUM screenshots from web-vitals.js, and patches you can copy into a PR.

RUM Without the Bloat

Synthetic Lighthouse runs lie politely; real user monitoring tells you which Samsung A-series device in São Paulo just experienced a 1.8s INP on your checkout button. The catch: most commercial RUM scripts weigh 40-90 KB of gzipped JavaScript and ironically degrade the very metrics they measure. We benchmark the lightweight options — web-vitals piped to your own collector, OpenTelemetry browser SDK, Cloudflare Web Analytics, SpeedCurve LUX — and show you exactly how many bytes and main-thread milliseconds each one costs.

Our team also documents the boring-but-critical parts: sampling strategy at scale, attributing INP to specific React components via the Event Timing API, and building Grafana dashboards that surface p75 CWV by route, country and device class without blowing your observability bill.

Image Pipelines That Actually Move CWV

Images remain the single largest lever for Largest Contentful Paint, and yet most teams still ship 1600px JPEGs to 360px phones. We dig into modern pipelines end-to-end: AVIF vs WebP encoding tradeoffs in 2026, the right srcset + sizes math for responsive heroes, fetchpriority="high" on the LCP candidate, and when link rel=preload helps versus when it just steals bandwidth from your CSS.

You'll find comparisons of the major resizers — Cloudflare Images, Cloudinary, imgproxy, Vercel Image Optimization, Netlify Image CDN — measured on cold-cache TTFB, encoded size, and CDN cache-hit ratios. We also cover the underrated wins: native lazy-loading rules, Client Hints in 2026, and why the <picture> element is still the most reliable way to ship AVIF with a WebP fallback.

Scroll down for our latest articles — fresh teardowns, migration notes from real production codebases, and the occasional vendor benchmark we ran so you don't have to. If a piece saves you an afternoon, that's the bar we're aiming for.