-
Notifications
You must be signed in to change notification settings - Fork 30.6k
Labels
Description
Link to the code that reproduces this issue
https://github.com/a89529294/client-side-router-invalidation
To Reproduce
- run
npm run build && npm run start - open
http://localhost:3000 - navigate to
http://localhost:3000/random-number, write down the number, I'll call itnumber1 - navigate back to
http://localhost:3000immediately, wait for > 25 seconds - then hover over the random number button and a new prefetch request will be sent because client-side router cache is stale now
- click on the random number button, you should still see the same number (
number1) because the previous prefetch request still sent back stale data, while in the background triggering a rull route cache revalidation. After the revalidation, the full route cache should store a new number,number2. - go back to
http://localhost:3000and wait for > 25 seconds. The reason we should wait for 25 seconds is because the client-side router cache is fresh for another 25 seconds - hover over the random number button, and another prefetch request should be sent (because the client-side router cache is stale), giving back the number
number2that is stored in
the full route cache. However that is not what happens. You will still seenumber1, because the prefetch request is never sent. No matter how long you wait, the prefetch request is never sent. - In order to see
number2, you have to manually refresh the page.
Current vs. Expected behavior
Current: the client side router cache only expires for the first time, then it becomes fresh forever.
Expected: the client side cache should expire every > 25 seconds, if the page is visited.
Provide environment information
Operating System:
Platform: darwin
Arch: x64
Version: Darwin Kernel Version 22.6.0: Thu Sep 5 20:48:48 PDT 2024; root:xnu-8796.141.3.708.1~1/RELEASE_X86_64
Available memory (MB): 8192
Available CPU cores: 4
Binaries:
Node: 20.15.0
npm: 10.9.0
Yarn: N/A
pnpm: 9.12.3
Relevant Packages:
next: 15.1.1-canary.17 // There is a newer canary version (15.1.1-canary.18) available, please upgrade!
eslint-config-next: 13.5.1
react: 19.0.0
react-dom: 19.0.0
typescript: 5.2.2
Next.js Config:
output: N/AWhich area(s) are affected? (Select all that apply)
Not sure
Which stage(s) are affected? (Select all that apply)
next build (local), next start (local)
Additional context
No response
Reactions are currently unavailable