Skip to content
NR.Niels Rigter

Why is your Next.js site slow?

A slow Next.js site is rarely caused by 'Next.js itself'. It's usually rendering choices, heavy JavaScript, slow data, or poorly optimized media. Here's how to tackle it systematically.

Updated 2026-07-31 · 8 min read

Short answer

Your site feels slow when the largest content appears too late, interaction lags, or the page jumps around. In Next.js, that's often caused by too much client-side work, slow APIs, or unoptimized images.

Measure first, then fix the biggest bottleneck. Don't blindly stack plugins or caching layers.

How slowness shows up

  • Long blank space before the page shows content (LCP)
  • Clicking feels slow or blocks (INP)
  • Layout jumps while loading (CLS)
  • Navigating between pages feels heavy due to large bundles

Common causes in Next.js

Too many Client Components: logic that could run on the server drags JS to the browser instead.

Heavy bundles: large libraries, unnecessary client state, unused code.

Slow data fetching: waterfalls, overly broad queries, no caching.

Media: large images without the right formats, sizes, or priority hints.

Poor hosting or cold starts: server response time (TTFB) slows everything down.

Measuring: lab vs field

Lighthouse is useful for diagnosis, but field data (CrUX / Search Console) says more about real users. Lab improvements show up faster; field metrics follow later.

Always measure before and after a fix. Otherwise you're optimizing by feel.

A fix order that works

  1. 1. Measure

    Capture LCP/INP/CLS and server timing. Note the top three problematic pages.

  2. 2. Biggest bottleneck first

    Often: a hero image, a slow API, or an overly heavy client bundle. One big win beats ten micro-fixes.

  3. 3. Rendering and caching

    Move work back to the server where possible. Cache what's stable. Avoid duplicate fetches.

  4. 4. Lock it in

    Keep budgets or monitoring in place, so the next feature doesn't undo the gains.

What you can check yourself

  • Are images huge or PNG where WebP/AVIF would work?
  • Does the homepage load dozens of third-party scripts?
  • Does only one page feel slow, or the whole app?
  • Is there a staging environment to test safely?

When I can help

If your Core Web Vitals are under pressure or users are complaining about speed, I can do targeted performance and technical SEO work in Next.js. Not a content agency: measurable technical improvements.

No. A CDN helps with assets and caching, but doesn't automatically fix slow queries or heavy client-side JS.

Back to knowledge base