next.js
next.js copied to clipboard
ISR results in stale data on detail page since v12.2.0
Verify canary release
- [X] I verified that the issue exists in the latest Next.js canary release
Provide environment information
Operating System:
Platform: darwin
Arch: arm64
Version: Darwin Kernel Version 22.1.0: Sun Oct 9 20:14:30 PDT 2022; root:xnu-8792.41.9~2/RELEASE_ARM64_T8103
Binaries:
Node: 18.12.0
npm: 8.19.2
Yarn: N/A
pnpm: 7.14.1
Relevant packages:
next: 13.0.3
eslint-config-next: N/A
react: 18.2.0
react-dom: 18.2.0
What browser are you using? (if relevant)
No response
How are you deploying your application? (if relevant)
both next start and Vercel
Describe the Bug
Example app: home page displays a list of products, clicking on an item opens the product details page. Product data is fetched from an external API. Both pages use ISR with revalidate: 30
.
Since Next v12.2.0, after the product data changes, the first request to display the updated data on the home page will display the old data in the detail page.
Demo video: https://user-images.githubusercontent.com/133967/201491661-93bc5803-abf2-4b29-9962-ac124c12e4dc.mp4
Expected Behavior
Both the home page and the detail page should display either the old or new data, as was the case with Next up to v12.1.6.
Link to reproduction - Issues with a link to complete (but minimal) reproduction code will be addressed faster
https://github.com/mirkonasato/isr-demo
To Reproduce
Clone the reproduction repo and run npm install
in it.
Set up and start Pocketbase (as the external API providing the data) as explained in the README.
Build and start the Next.js app. Follow the same steps as in the demo video i.e. open the home page, change the price in the backend, reload the home page until it shows the new price, then navigate to the detail page.
I think this may be related to PR 32701: Update to not trigger revalidation during prefetch. But if prefetching keeps returning stale data and not triggering revalidation it doesn't seem very useful.