whats your current setup? Is your route alr static? Do you have loading.tsx? Are you using cacheComponents? What nextjs version are you on?

Do you have any data fetching in that route? If so you can wrap the data fetching part in <Suspense>. It will allow the route to instantly switch and display the fallback UI until the data fetching is done. https://nextjs.org/docs/app/getting-started/fetching-data#streaming

export default function Page() {
  return (
    <div>
      <h1>My Page</h1>
      <Suspense fallback={<FallbackUI />}>
        <SlowDataFetchingComponent />
      </Suspense>
    </div>
}

Edit: Sorry didn't see someone else has already replied since I was typing.

It's just a pagemtsx with data being fetched in useEffect hooks. Yes there is a loading.tsx. Looking up about cache component not sure what those are. Nextjs 14. Thanks!

alright. cacheComponents are only available in next16. loading.tsx is good, but as you using useEffect it has zero effect. Also while using useEffect the requests to your data storage also increase, as nothing is cached.

So to make your page loading instantly:
- update to next16 (if you really want fast) OR
- at least use SSR like fetching your data on the server

I find also, if you're running in Dev it can feel real slow on navigation

Like cache components in prod on Vercel is like a cheetah

ok bro so this is what is happening. Nextjs does something called code splitting which means the whole JavaScript bundle isn't sent to the browser on at once. only chunks of what's needed is sent to browser on request .

so when you're on /routeA and route to /routeB, Nextjs request for that page chunk which causes that little delay. if you route back to a page you've visited before, you'll notice the routing feels instant

in SPA, the routing feels instant because the browser downloads the whole JavaScript bundles at once but in Nextjs its different

one way to have a bit of a performance boost is to use the Link component. it helps preload pages so routing to them feels more faster than before


hope this helps

@Brown bear hope you see this

Is there any reason why you are fetching data inside an useEffct instead of fetching directly inside RSC’s?

you don't need cache components for now

exactly