Skip to content

Router Cache not working after first invalidation #58723

@seho0808

Description

@seho0808

Link to the code that reproduces this issue

https://github.com/seho0808/next_js_13_caching_test

To Reproduce

I found an error with Router Cache. This app works fine initially: Server Component's RSC Payload stays cached on browser for the first five minutes (dynamic page). However, after 5 minutes, when first invalidation happens, it just never gets cached again and keeps fetching on every single navigation. If I refresh the page, the Router Cache becomes fine again until the next invalidation.

To run the app, please follow the commands below.

# start the node server first (which provides an example api endpoint of https://localhost:8001
node server.js

# start the next.js web server
npm install
npm run build
npm run start

After the app is ready, please run the steps below.

  1. First if you go to http://localhost:3000, you will see the two values (from client: some value and from server: some value)

  2. If you navigate between the hello page and the home page, you can see the Router Cache works perfectly, only caching the server component render.

  3. Now switch tab and do other things for 5 minutes (invalidation time for dynamic route)

  4. Come back and again navigate between hello page and home page.

  5. Now both values change every time you navigate... Is this an intended behavior???

  6. If I refresh, it works again...

Current vs. Expected behavior

Current Behavior: My app example's Router Cache caches server component's value until the first invalidation. After the first invalidation, server component rendered on browser changes its value every single time I navigate between pages with Link component.

Expected Behavior: Dynamic Page RSC Payload is supposed to be re-cached every 5 minutes, so the data within Server Component is expected to only change every 5 minutes unless I refresh(which manually invalidates Router Cache).

Verify canary release

  • I verified that the issue exists in the latest Next.js canary release

Provide environment information

Operating System:
  Platform: win32
  Arch: x64
  Version: Windows 10 Pro
Binaries:
  Node: 18.16.0
  npm: N/A
  Yarn: N/A
  pnpm: N/A
Relevant Packages:
  next: 14.0.3
  eslint-config-next: 14.0.3
  react: 18.2.0
  react-dom: 18.2.0
  typescript: 5.3.2
Next.js Config:
  output: N/A

Which area(s) are affected? (Select all that apply)

Not sure, Data fetching (gS(S)P, getInitialProps)

Additional context

I tried testing on 14.0.3 and 14.0.4-canary.6. Both had the same issue.

NEXT-2436

Metadata

Metadata

Assignees

No one assigned

    Labels

    Pages RouterRelated to Pages Router.bugIssue was opened via the bug report template.linear: nextConfirmed issue that is tracked by the Next.js team.locked

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions