How to fix Cumulative Layout Shift in Next.js
CLS is caused by content that arrives without reserved space: images, fonts, ads and client-only widgets. How to find each shift and reserve space for it.
5 posts
CLS is caused by content that arrives without reserved space: images, fonts, ads and client-only widgets. How to find each shift and reserve space for it.
LCP is usually one element and one slow step. How to find both in Next.js: the image, the font, the server response, and the render path that delays them.
Next.js 16 upgrade notes: async params everywhere, typed PageProps, middleware renamed to proxy, a Tailwind 4 gotcha, and the docs inside node_modules.
A measurement-driven guide to Next.js performance: Core Web Vitals, shipping less JavaScript, images, fonts, caching and deferring third-party scripts.
How to improve First Contentful Paint in a Next.js app: measuring it, shipping less JavaScript, taming fonts, deferring scripts and serving static HTML.