-
-
Notifications
You must be signed in to change notification settings - Fork 1.6k
Description
Which project does this relate to?
Router
Describe the bug
Lazy components (defined with React.lazy) should render during SSR and then defer hydration for their subtree on the client (until the lazy import resolves). This usually happens correctly, however, if a parent route provides a context provider that re-renders before the lazy import resolves, the deferred hydration is abandoned and the lazy component suspends until resolved. This creates a flicker where top-level lazy components go from rendered UI to suspense fallback back to rendered UI on page load.
This issue only reproduces if the following conditions are met:
- The lazy component must be defined with
React.lazyand be initially visible to render during SSR - The parent component that re-renders must be a context provider
- The parent context provider must be rendered by a parent route, not the same route as the lazy component
- The parent context provider must re-render before the lazy component renders
Your Example Website or App
https://github.com/iansan5653/react-lazy-hydrate-issue-tss.git
Steps to Reproduce the Bug or Issue
- Clone the repo and
npm install - Run
npm run dev - Observe that the fallback UI ("Loading...") is visible. Also observe the browser console logs showing that the fallback was rendered
To demonstrate expected behavior:
- Try deleting the
RerenderingProviderfrom the root route, or simply commenting out the rerender effect - Hard reload the page
- Observe that the fallback UI does not render
Expected behavior
The lazy component UI should render during SSR, then remain stable (without suspending) until the deferred hydration completes.
Screenshots or Videos
Screencap of demo (note that the lazy import is artificially slowed down for demo purposes):
Screen.Recording.2026-02-25.at.1.57.38.PM.mov
Console logs, indicating the render/fallback lifecycle (note StrictMode is enabled, causing extra renders):
Platform
- Router / Start Version: 1.132.0
- OS: macOS
- Browser: Chrome
- Browser Version: 145.0.7632.110
- Bundler: vite
- Bundler Version: 7.1.7
Additional context
No response