nextjs - 💡(How to fix) Fix not-found.tsx: Infinite Loop when a Component Calls router.refresh [2 comments, 2 participants]

Official PRs (…)
ON THIS PAGE

Recommended Tools

×6

Utilities matched from this issue’s tags and category — try them while you read without losing context.

GitHub issue graph ai analysis

Paste a GitHub issue URL. We fetch that issue, discover linked issues from bodies/comments/timeline, collect linked pull requests, and produce a structured English report.

The report is written in English Markdown for sharing and archival.

Helpful · Quick feedback

Loading…
GitHub stats
vercel/next.js#86197Fetched 2026-04-08 02:12:03
View on GitHub
Comments
2
Participants
2
Timeline
5
Reactions
0
Author
Timeline (top)
commented ×2issue_type_added ×1labeled ×1renamed ×1

Code Example

GET http://localhost:3000/foo 404 (Not Found)

Navigated to http://localhost:3000/foo
 [HMR] connected
 
 GET http://localhost:3000/foo?_rsc=ttys4 net::ERR_ABORTED 404 (Not Found)
 
 GET http://localhost:3000/foo 404 (Not Found)

---

Operating System:
  Platform: darwin
  Arch: arm64
  Version: Darwin Kernel Version 23.5.0: Wed May  1 20:12:58 PDT 2024; root:xnu-10063.121.3~5/RELEASE_ARM64_T6000
  Available memory (MB): 16384
  Available CPU cores: 8
Binaries:
  Node: 24.9.0
  npm: 11.6.0
  Yarn: 1.22.22
  pnpm: 10.17.1
Relevant Packages:
  next: 16.0.2-canary.21 // Latest available version is detected (16.0.2-canary.21).
  eslint-config-next: N/A
  react: 19.2.0
  react-dom: 19.2.0
  typescript: 5.9.3
Next.js Config:
  output: N/A
RAW_BUFFERClick to expand / collapse

Link to the code that reproduces this issue

https://github.com/columk1/next-404-loop

To Reproduce

  1. Start the application in development mode
  2. Visit localhost:3000/foo

Current vs. Expected behavior

When a 404 is triggered within a layout, if router.refresh is called somewhere in the component tree, there is a request for the updated RSC of the current route, which doesn't exist for not-found.tsx, triggering another 404.

Console log that loops forever:

GET http://localhost:3000/foo 404 (Not Found)

Navigated to http://localhost:3000/foo
[HMR] connected

GET http://localhost:3000/foo?_rsc=ttys4 net::ERR_ABORTED 404 (Not Found)

GET http://localhost:3000/foo 404 (Not Found)

Provide environment information

Operating System:
  Platform: darwin
  Arch: arm64
  Version: Darwin Kernel Version 23.5.0: Wed May  1 20:12:58 PDT 2024; root:xnu-10063.121.3~5/RELEASE_ARM64_T6000
  Available memory (MB): 16384
  Available CPU cores: 8
Binaries:
  Node: 24.9.0
  npm: 11.6.0
  Yarn: 1.22.22
  pnpm: 10.17.1
Relevant Packages:
  next: 16.0.2-canary.21 // Latest available version is detected (16.0.2-canary.21).
  eslint-config-next: N/A
  react: 19.2.0
  react-dom: 19.2.0
  typescript: 5.9.3
Next.js Config:
  output: N/A

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

Not Found

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

next dev (local), next start (local)

Additional context

It's a problem with an app of mine in production but not in dev for some reason. I was surprised when it reproduced in dev.

I understand the solution is probably to find a way to avoid calling router.refresh on mount, but I will still share the issue in case it's preventable upstream.

extent analysis

TL;DR

Avoid calling router.refresh on mount to prevent the 404 loop.

Guidance

  • Identify and refactor components that call router.refresh on mount to prevent unnecessary refreshes.
  • Verify the fix by checking the console logs for the absence of the 404 loop after visiting localhost:3000/foo.
  • Investigate why the issue only reproduces in production and not in development mode to ensure the fix works in all environments.
  • Consider adding a check to prevent router.refresh from being called when the current route is a 404 page.

Example

No code snippet is provided as the issue does not include specific code that needs to be modified.

Notes

The provided environment information and package versions may be relevant when troubleshooting the issue, but the root cause seems to be related to the router.refresh call on mount.

Recommendation

Apply workaround: Avoid calling router.refresh on mount, as this is likely the cause of the 404 loop, and refactoring the code to prevent unnecessary refreshes should resolve the issue.

Vote matrix · Quick signals

Works
Did the solution work? Tap to confirm.
Easy Fix
Was it a quick fix?
Time Saver
Did it save you time?
Blocking
Was it severely blocking?
Common Issue
Are others likely hitting this too?
Flaky / Intermittent
Is it intermittent?
Verified / Reproducible
Can you reproduce it reliably?
Loading…

Still need to ship something?

×6

Another batch ranked right after the header list — different links, same matching logic.

Back to top recommendations

TRENDING

nextjs - 💡(How to fix) Fix not-found.tsx: Infinite Loop when a Component Calls router.refresh [2 comments, 2 participants]