NextJS page keep reloading again and again.

[touqeeraslam]

What version of Next.js are you using?

10.0.3

What version of Node.js are you using?

12.0.0

What browser are you using?

Chrome

What operating system are you using?

macOS, Windows

How are you deploying your application?

next start

Describe the Bug

It occurs sometimes to me that my page keeps reloading and again. I don't know why it occurs but it happens for only one page and the problem is that I am unable to reproduce this but I often get feedbacks from the users and acknowledged one or two times myself that it is reloading my page again and again.

can you please guide that what can be the issue that It keeps reloading?

when i close the tab and reopen the page it does not occur. Strange

Expected Behavior

It should not reload page and again

To Reproduce

I am unable to reproduce this by repeating any scenario.

[meglio]

I too have a page reloaded every ~30 seconds or so when running in dev mode and not touching a single source file. What could be the problem? How to stop Next.js from reloading the page?

[aslamcodes]

Yep, It was happening to me, keeps refreshing, and unable to test my site

[efleurine]

@aslamcodes @meglio @touqeeraslam

I just faced a similar problem with a teammate. And the reason was that I have added those configurations in the next.config file.

  onDemandEntries: {
    // period (in ms) where the server will keep pages in the buffer
    maxInactiveAge: 10 * 1000,
    // number of pages that should be kept simultaneously without being disposed
    pagesBufferLength: 1,
  },

I am on windows with a 12 gb ram which goes pretty quickly when chrome - node - vscode are all running so I was trying to save there. While it did not have any adverse effect for me, my teammate who has a MAC was seeing the pages being refreshed again and again. Removing those configs make things work again for him.

So I can guess that having those specific parameters with those values can create this kind of side effect. Like if you have customs values try to remove them, and restart your dev; or if you don't have try to add with higher values especially for maxInactiveAge. So check the docs and try different values to see how things go.

when testing try to not have a too many programs in memory.

hopefully I was helpful. thanks

[meglio]

Hey NextJs team, could you add an explanatory comment to the console (both browser console and command line console) that explains why exactly a page got reloaded? It would make it much easier for people to investigate issues like this.

[MA-Ghani]

I'm facing the similar issue. Anyone looking into this from nextjs team?

[g13013]

Why the issue is closed ?

[usmangurowa]

I am facing the same issue, but the problem occur only on the 404 page.

[markiplagat]

Some pages in my app keeps on reloading, anyone got a solution to it?

[janisverins]

Same here. If page is a 404, it keeps infinitely reloading.
Please help if anyone has any idea.

[ndegealbert]

Same issue, if anyone finds the same please let us know

[janisverins]

Hi everyone, forgot about this but this is how I solved the issue on my project:

• We were using fallback: true in NextJs getStaticPaths function to preload dynamic pages;
• After preloading the pages without the fallback (set fallback: 'blocking' instead of fallback: true) the infinite reload on 404 pages stopped.

Please check if this helps in your case.
If you dont what fallback: 'blocking' - basically it its the same as with value true, just fallback content will not be displayed when generating the page.

[ndegealbert]

I have deployed my next.js application AWS instance if I try to access query params on production the app keeps reloading but on Vercel it was working fine

[szsebasa1]

Hi! How did you solve it?

[inahsanjuan]

Did you have a solution for this in AWS?

[szsebasa1]

In our case the issue was with the i18n lib in Firebase, we removed it for now

[ndegealbert]

Hello,

Something was wrong with how i was building the docker image on the docker file,
I changed my docker file to this and it worked.

`
FROM node:16-alpine AS BUILD_IMAGE
RUN mkdir -p /usr/app/
WORKDIR /usr/app
COPY ./ ./

ARG NEXT_PUBLIC_BASE_URL

ENV NEXT_PUBLIC_BASE_URL=$NEXT_PUBLIC_BASE_URL

RUN npm install

RUN npm run build

EXPOSE 3000

CMD [ "npm", "start" ]

`
Define your own ARG on your dockerfile and ENV if you have them

[RossPfeiffer]

uhm. this sounds like it may be a problem in production too?

[mohas]

To add a little more info, We are having the same issue in production, so as I stand now the problem seems to be some sort of caching, apparently the page builds and the buildId changes but the cached version of the page on the client side keeps looking for the old file and when it does not find it it reloads the page, we always have 404 for _ssgManifest.js and _buildManifest.js file, for example site is looking for /_next/static/x09i9osKBpgVkaeYtbeYj/_buildManifest.js but it is not on the server, it has changed to /_next/static/HBM1BsksGd6EkZyv-jh68/_buildManifest.js but the page keep looking for the old file and reloading when it is not finding it
we are using pm2, it could be causing it as well by serving the old website from memory and not updating from disk

[netrolite]

for me the issue seems to be fixed after I stopped the dev server and started it again

[Irrelon]

I've noticed that deleting the .next folder and restarting the dev process seems to solve it momentarily, however, making changes to the code can often cause it to start up again. If I stop the server, the client requests the page over and over at very high speed. This appears to be entirely driven from the front-end somewhere.

[damsalem]

for me the issue seems to be fixed after I stopped the dev server and started it again

This worked for me too

[leerob]

There were a few issues here that should be resolved on the latest version of Next.js, e.g. when using error.js files. Please update the the latest version and if you're seeing a bug, open an issue with a reproduction 🙏

[enchorb]

13.5.0+ completely broke Next for us, page keep reloading. Reverting back to 13.4.19 fixed it.

In the 13.5.0+ keep getting the error:

⚠ Fast Refresh had to perform a full reload due to a runtime error.
ChunkLoadError: Loading chunk app/layout failed

Edit: Next 14 seems to have fixed this for us

[toygma]

Yes, the page continues to load and does not open. Is there a solution?

[sachyyn]

@leerob Any updates on this.
This is happening even in v14.2.5. Does a full page reload on Link clicks specifically in build (local build, docker).
Works fine in dev mode

[wallawe]

I had this problem and commented out the following lines in my next.config file:

  experimental: {
      bundlePagesExternals: true,
      esmExternals: "loose",
  }

everything was gravy after that.

(using 14.2.4)

[dalalRohit]

i am facing the same issue with version 14.2.5. please help

[issam-seghir]

the same problem happens to me in v14.2.2