Version Skew, generated file naming, and server caching in deployed environments?

[mattgbrich]

Summary

We're troubleshooting an unusual issue and I would appreciate any insights/feedback on our hypothesis!

Sometimes when we use the client side router to navigate a user from one page to another we are seeing the full client side application reload itself.

After a lot of debugging, this is the hypothesis we've come to:

Our firewall (Imperva) is doing some client-side caching of resources. When we generate and deploy new build of our Next application, some of the file names that contain generated IDs (ex: /_next/static/chunks/7958-f7fac8a72e3090e6.js) either have new IDs generated in the new build, or the order/configuration of those files changes between builds. Our Firewall returns a file to the browser that still contains the old file names, and on page change it makes a request back to our server for an old file that no longer exists. Our Next application sees that the file it requested doesn't exist, so it figures the client-side code must be stale and it forces a full reload to pull in the new changes.

Does this hypothesis sound plausible based on how NextJS manages it's file tree on builds, and how it manages page reloads on identifying stale code client-side?

Do some of these file names change based on changes we make in our code?

If the client-side NextJS makes a request for 123.js and the server doesn't find that file, does the client side Next application reload to clear stale cache?

Thanks!

Additional information

Some additional things we've identified that support this hypothesis:

- There is only one single build of our NextJS application that works. It seems this could be because that is the build that the firewall cache was generated from. Even if we make a new build of the exact same code it doesn't work.

- After disabling cache in the browser, it works as expected.

- After clearing the firewall cache, it works as expected.

- Client side caching is turned on in the firewall.

- The issue can only be replicated in environments with the firewall active.

Example

No response

[mattgbrich]

I'm wondering if what we're seeing is related to this paragraph about Version Skew: https://nextjs.org/docs/app/guides/self-hosting#version-skew

It would be great to get more detail about exactly what happens here and how that deploymentId that is mentioned is handled.