content-visibility: Skip Rendering Work on Long Pages
content-visibility and CSS containment limit the rendering work of long pages to the visible area - with placeholder heights that avoid new layout shifts.
How fast a page really feels is decided in the browser. This category collects articles on the front-end side of optimisation: image formats and responsive sizes, web fonts and their loading behaviour, CSS delivery and critical styles, JavaScript bundles and how to split them, deferred loading, third-party scripts and their side effects. We explain how layout shifts occur and how reserved space prevents them, why interactivity suffers under long tasks and which techniques reduce the main work in the browser. Every article describes measurement before and after the change, so the effect of a measure can be quantified rather than assumed. We also cover collaboration: which requirements for design and editing prevent every new page from degrading loading time again.
content-visibility and CSS containment limit the rendering work of long pages to the visible area - with placeholder heights that avoid new layout shifts.
Compression dictionary transport per RFC 9842: how browsers and servers ship bundles as deltas against the previous version - patterns, configuration, fallback.
How the back/forward cache keeps whole pages in memory and makes back navigation instant: blockers, Cache-Control: no-store and testing in DevTools.
How the Speculation Rules API prefetches or prerenders next pages, tunes eagerness correctly, and avoids wasted prerenders and analytics side effects.
How fetchpriority='high' loads the LCP image sooner: correct use, interplay with preload and srcset, the most common mistakes and the LCP quick win.
How preload, prefetch, preconnect, dns-prefetch and priority hints shorten connection setup, speed up the LCP image and fonts -- and where over-loading hurts.
Lazy loading for images and components, route-based code splitting and dynamic imports cut initial JavaScript and improve Core Web Vitals on every page.
Web fonts cost load time and cause layout shifts. Learn how to optimize fonts with font-display, preload, subsetting and WOFF2 for fast pages.
Video as an underrated load-time driver: poster as LCP candidate, lean preload, modern codecs and facades for embedded players - so no video slows the page.
Smooth animations without jank: the 16.7 ms frame budget, why only transform and opacity stay cheap, and how to hunt down frontend jank in the DevTools.