Debugging INP regressions with the Long Animation Frames API
INP became a Core Web Vital in March 2024, and most of us reached for the same tools we'd been using for FID. For the trickier regressions you'll stare at clean traces and lose a week.
All Articles
HTTP 103 Early Hints: Cut TTFB and LCP by Preloading During Server Think-Time
HTTP 103 Early Hints lets servers preload critical resources during backend think-time, cutting LCP by 100-400ms. A practical 2026 guide for Cloudflare, Fastly, and Node.js origins.
HTTP/3 and QUIC for Web Performance: A Practical 2026 Guide
HTTP/3 over QUIC removes TCP head-of-line blocking and cuts mobile load times 20-60%. Practical setup for Nginx, Caddy, and Cloudflare with a rollout plan.
Speculation Rules API: Achieve Instant Page Loads with Prerender in 2026
Learn how the Speculation Rules API enables near-instant page navigations by prefetching and prerendering pages before users click. 2026 guide covering eagerness, prerender-until-script, and implementation.
Compression Dictionaries Transport: Cut JavaScript Payload by 80% in 2026
Compression Dictionaries Transport (dcb/dcz) ships in Chrome 123+ and can shrink your JavaScript delta updates by 80-95%. Here's the production setup, real numbers, and the gotchas the spec doesn't warn you about.
Measuring Core Web Vitals in SPAs: The 2026 Soft Navigations API Guide
SPAs break LCP, INP, and CLS measurement — only the landing page gets real data. Chrome 147's Soft Navigations API finally fixes per-route Core Web Vitals tracking. A practical 2026 guide with code for PerformanceObserver, the web-vitals soft-navs build, and a production-safe hybrid strategy.
fetchpriority and Priority Hints: The Complete LCP Optimization Guide for 2026
The fetchpriority attribute is one of the most precise tools for shaping browser resource loading. Used right, it can shave 200-800ms off your LCP without touching CSS or JavaScript. Here's every legitimate use case, the mistakes that quietly hurt performance, and how to measure real-world impact.
scheduler.yield(): Break Up Long Tasks the Right Way and Fix INP in 2026
scheduler.yield() is the modern way to break up long JavaScript tasks and fix INP. Learn the patterns, the comparison to setTimeout and postTask, and a production-ready fallback.
Real User Monitoring (RUM) with the web-vitals Library: A Practical 2026 Setup Guide
Set up production Real User Monitoring with Google's web-vitals v4 library. Capture LCP, INP, and CLS attribution data, build a custom collection endpoint, sample smartly, and reconcile field data with Lighthouse — every step with working 2026 code.
The Long Animation Frames (LoAF) API: How to Debug and Fix Slow Interactions
Learn how to use the Long Animation Frames (LoAF) API to diagnose and fix slow INP interactions. Covers script attribution, rendering phase breakdowns, third-party impact analysis, and production reporting.
CSS Scroll-Driven Animations: Build Smooth Scroll Effects with Zero JavaScript
Build production-ready scroll-based animations using CSS scroll() and view() timelines. Runs on the compositor thread with zero JavaScript, zero INP impact, and full code recipes for progress bars, parallax, and scroll reveals.
Zstandard (zstd) HTTP Compression: A Practical Guide to Faster Web Delivery
Learn how to set up Zstandard (zstd) HTTP compression on Nginx, Caddy, Node.js, and Cloudflare. Includes benchmarks against gzip and Brotli, plus how the right compression strategy improves TTFB, LCP, and Core Web Vitals.