{
  "id": 19250963,
  "title": "Why Next.js Navigation Feels Slow Even When the Server Is Fast",
  "url": "https://urgent.news/2026/11/10/why-next-js-navigation-feels-slow-even-when-the-server-is-fast",
  "topic": "tech",
  "section": "Tech",
  "published": "2026-11-10T00:30:32.000Z",
  "source": {
    "name": "Dev.to",
    "slug": "dev-to",
    "url": "https://dev.to/moondaeseung/why-nextjs-navigation-feels-slow-even-when-the-server-is-fast-4kop"
  },
  "original_language": "en",
  "account": "When clicking a link in a Next.js application, the navigation can sometimes feel slow, even if the server is fast. The issue lies in the browser's handling of React Server Component (RSC) payloads. RSC payloads are serialized representations of the component tree sent from the server to the browser, but they do not simply contain HTML or the source code of the Server Components.\n\nIn a client-rendered application, the browser can render a destination screen immediately after receiving JavaScript, even if the data is still loading. However, with RSC, the browser receives the rendered output through the RSC payload, along with references to Client Components and the props needed by those components. This payload is not HTML or source code.\n\nThe navigation delay occurs when the browser waits for the required payload to arrive before navigating to the next screen. The prefetching process can mitigate this delay, but its effectiveness depends on the route type. For statically rendered routes, the full route can be prefetched, while for dynamically rendered routes, prefetching happens only down to the nearest loading.js boundary.\n\nPartial Prefetching, available in Next.js 16.3 and later, changes the prefetching strategy. It focuses on the shared App Shell and requests reusable route content when the user clicks. This approach can reduce the wait after a click but also requires more server work beforehand.\n\nDynamic segments, such as posts/[slug], do not always mean request-time rendering. GenerateStaticParams can provide values for prerendering, and dynamic rendering occurs only when request-specific values like cookies() or headers() are used. In these cases, the route may no longer have a completely static response that can serve every request.\n\nUnderstanding how Next.js fetches RSC payloads and which parts it can reuse is crucial to explaining and fixing the perceived navigation delay. Techniques like cacheComponents, partialPrefetching, and prefetching can help optimize navigation performance in Next.js applications.",
  "summary": "I used Next.js for a while before I could explain why clicking a link sometimes did nothing for a moment. The server was not doing anything especially expensive. The browser already had plenty of JavaScript. Yet the next screen still waited for a network round trip. The missing piece was the React Server Component payload for the destination route. Understanding when Next.js fetches that payload,…",
  "key_points": [
    "Browser treats RSC payloads differently than HTML",
    "Navigation delay caused by waiting for payload",
    "Partial Prefetching improves navigation speed"
  ],
  "editors_take": "The reliance on serialized payloads instead of immediate HTML forces browsers to wait for full data transfers, shifting the burden of navigation speed from server response times to payload management.",
  "illustration": null,
  "coverage": {
    "outlets": 1,
    "also_reported_by": []
  },
  "ai_generated": true,
  "disclaimer": "Summaries, key points and the editor’s take are written by software from other outlets’ reporting and may contain errors — always check the linked original."
}