nextjs - 💡(How to fix) Fix Redirect causes content collapse (empty state) instead of showing a loader [7 comments, 4 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#83830Fetched 2026-04-08 02:02:08
View on GitHub
Comments
7
Participants
4
Timeline
14
Reactions
3
Timeline (top)
commented ×7subscribed ×3mentioned ×2issue_type_added ×1

Code Example

Operating System:
  Platform: darwin
  Arch: arm64
  Version: Darwin Kernel Version 23.6.0
Binaries:
  Node: 20.17.0
  npm: 10.8.2
Relevant Packages:
  next: 15.4.4
  react: 19.1.0
  react-dom: 19.1.0
Next.js Config:
  output: N/A
RAW_BUFFERClick to expand / collapse

Link to the code that reproduces this issue

https://github.com/GlebKodrik/redirect

To Reproduce

  1. Start the app with next dev
  2. On the page, click the "GO TO CHECK" button
  3. You will first see "TEST LOADING..."
  4. Then the page content collapses (shows an empty state/blank screen)
  5. Finally, the target page content (from gleb) is displayed

Current vs. Expected behavior

Current Behavior After triggering a redirect with redirect from next/navigation, the UI briefly collapses to an empty state before rendering the redirected content. This looks like a freeze or glitch. The issue happens both in development and after running a production build.

Expected Behavior Instead of collapsing to an empty state, the app should keep showing a loader (or any fallback UI) until the redirected page is fully rendered. The transition should feel smooth without a "flash of nothing".

Provide environment information

Operating System:
  Platform: darwin
  Arch: arm64
  Version: Darwin Kernel Version 23.6.0
Binaries:
  Node: 20.17.0
  npm: 10.8.2
Relevant Packages:
  next: 15.4.4
  react: 19.1.0
  react-dom: 19.1.0
Next.js Config:
  output: N/A

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

Redirects

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

next dev (local)

Additional context

The issue is reproducible locally. I would like to avoid the "collapse" state and instead keep a loader until the redirected page content is ready.

extent analysis

TL;DR

Implement a loading state that persists until the redirected page is fully rendered to avoid the brief collapse of the UI.

Guidance

  • Investigate using next/navigation's useNavigation hook to detect when a navigation is in progress and display a loader during that time.
  • Consider adding a delay or a timeout to ensure the loader is visible for a minimum amount of time to avoid a "flash of nothing".
  • Review the next configuration to see if there are any options to customize the behavior of redirects and loading states.
  • Use the useEffect hook to handle the loading state when the component mounts and unmounts.

Example

import { useNavigation } from 'next/navigation';

function MyComponent() {
  const navigation = useNavigation();

  if (navigation.state === 'loading') {
    return <div>Loading...</div>;
  }

  // Render the component as usual
}

Notes

The provided example is a basic illustration and may need to be adapted to the specific use case. The next/navigation API and useNavigation hook should be consulted for more information on customizing the loading state.

Recommendation

Apply a workaround by implementing a custom loading state that persists until the redirected page is fully rendered, as the root cause of the issue seems to be related to the default behavior of next/navigation during redirects.

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 Redirect causes content collapse (empty state) instead of showing a loader [7 comments, 4 participants]