0

I have a Next.js app using next 13.4.13. I am using the traditional pages directory.

The app has 2 pages. The directory looks like this:

/pages/light

/pages/heavy

The light page is very small, it just has a basic form on it.

The heavy page is very heavy, 10mb of babylonjs.

After login, the user is taken to pages/light , that is almost instant because the JS from light is so small. But now when i click on the navbar to go to the heavy page, there is a 2 or 3 second lag while the browser receives the huge JS file.

How can i change the settings in Next.js so that the JS from the heavy page gets downloaded as soon as I login / land on the light page, so that user does not have to wait after navigating to the heavy page?

Jar
  • 1,766
  • 1
  • 21
  • 27

1 Answers1

0

figured it out, you can prefetch using Link or router.prefetch(): https://nextjs.org/docs/app/building-your-application/routing/linking-and-navigating#1-prefetching

Jar
  • 1,766
  • 1
  • 21
  • 27