Web performance
Core Web Vitals, caching, CDNs, modern images and fonts, lean JavaScript and real-user data.
Back/forward cache: instant pages with the Back and Forward buttons
How the browser's bfcache works, which coding habits block it and how to check that your site's pages are restored instantly when users go back.
Brotli and gzip compression: levels, precompression and checks
How HTTP response compression works, when to choose Brotli or gzip, which levels to use for static and dynamic files, and how to verify that it works.
Browser memory leaks: finding them with heap snapshots
How to recognize a memory leak in a web page, the most common causes such as listeners and detached nodes, and how to track them down with the Memory panel.
CLS: eliminating layout shifts one cause at a time
The most common causes of Cumulative Layout Shift, from images without dimensions to banners and fonts, with the CSS and HTML fixes that keep a page stable.
Code splitting and tree shaking: shrinking the JavaScript bundle
How to split JavaScript into chunks loaded only when needed, strip dead code from dependencies and find out what is really bloating your bundle.
The DevTools Performance panel: reading a profile step by step
How to record a profile in Chrome DevTools, read tracks, flame charts and long tasks, and get from a slowdown to the line of code responsible for it.
Do-it-yourself RUM: PerformanceObserver and the web-vitals library
How to collect LCP, INP and CLS from real users with PerformanceObserver and web-vitals, send them reliably and analyse them by percentile.
Facades for embeds: video, maps and chat without the slowdown
How to replace heavy video, map and widget iframes with a lightweight preview that loads the real component only when the user actually asks for it.
103 Early Hints: using server think time to start loading sooner
How the HTTP 103 Early Hints response works, which resources to send with preconnect and preload, support limitations and how to check that it works.
HTTP/2 and HTTP/3: what really changes for site speed
Multiplexing, header compression and QUIC explained in practice: which old optimizations to drop and what still matters with HTTP/2 and HTTP/3 today.
Hydration and islands architecture: less JavaScript, faster pages
Why server-rendered pages that are fully hydrated still feel slow, and how partial hydration, islands and server components cut the work down.
INP: reducing interaction latency on the main thread
What Interaction to Next Paint measures, why clicks and taps feel slow, and how to break up long JavaScript tasks to hand control back to the user quickly.
Lab data and field data: why the scores do not match
Lighthouse and field data measure different things: how to read both, why they diverge, and which one to rely on when deciding where to work on your site.
Large DOM and content-visibility: lighter long pages
Why a DOM with too many nodes slows styles, layout and interactions, and how content-visibility, contain and list virtualization cut the work.
Optimizing LCP: breaking the time down into four phases
How to diagnose a slow LCP by splitting it into TTFB, load delay, load duration and render delay, with a targeted fix for each phase of the metric.
Performance budgets: stopping regressions before release
How to set weight and timing limits for a site, check them automatically on every change with Lighthouse CI and deal with the variability of measurements.
Preload, preconnect and fetchpriority: hinting at priorities
When to use preload, preconnect, dns-prefetch and fetchpriority to help the browser fetch what matters first, and how to avoid the overuse that slows pages.
Reading the network waterfall: what each coloured bar reveals
A practical guide to the request waterfall in DevTools: connection phases, dependency chains, priorities and the patterns that signal a loading problem.
Reducing TTFB: where time is lost before the first byte
Time to First Byte broken down into redirects, DNS, connection and server processing, with the typical causes of slowness and the most effective fixes.
Service workers and caching strategies: speed and offline support
Cache first, network first and stale-while-revalidate explained with examples, plus the service worker lifecycle and the mistakes that block updates.
Smooth web animations: compositor, will-change and forced reflow
Which CSS properties to animate without jank, how to avoid layout thrashing by batching DOM reads and writes, and how to verify it with DevTools.
Speculation Rules: prerender and prefetch for instant navigation
How to use Speculation Rules to prefetch or prerender the next pages, choose how eager the browser should be and avoid unwanted side effects.
Third-party scripts: measuring their cost and keeping them in check
Tag managers, widgets, pixels and chats slow a site down more than its own code: how to measure their impact, decide what to keep and load them safely.
Unused CSS and critical CSS: slimming down your stylesheets
How to find out how much CSS a page does not use, remove it safely, extract the critical styles and load the rest without blocking the first render.
Web workers: moving heavy computation off the main thread
When a web worker is worth it, how to communicate with postMessage and transferable objects, and which jobs to move to keep the page responsive.