Skip to content

fix: isHydration will cause unnecessary rerender #4212

Merged
shuding merged 2 commits intomainfrom
fix/extra-render
Jan 30, 2026
Merged

fix: isHydration will cause unnecessary rerender #4212
shuding merged 2 commits intomainfrom
fix/extra-render

Conversation

@promer94
Copy link
Copy Markdown
Collaborator

close #4210

The current solution is inspired by seb's previous tweet (The original tweet was deleted)
Screenshot 2026-01-25 at 16 36 39

@codesandbox-ci
Copy link
Copy Markdown

codesandbox-ci bot commented Jan 25, 2026

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

@promer94 promer94 requested review from Copilot and removed request for huozhi and shuding January 25, 2026 08:42
@promer94 promer94 requested review from huozhi and shuding January 25, 2026 08:42
Copy link
Copy Markdown

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR fixes an unnecessary re-render issue in useSWR during hydration. When using SWR in server-side rendered applications (like Next.js), components were rendering twice even when not calling the fetcher, due to the hydration detection mechanism triggering a state change.

Changes:

  • Modified the hydration detection logic to use a ref-based approach that avoids triggering re-renders
  • Added E2E tests to verify the fix prevents extra renders
  • Added E2E tests for the server prefetch warning functionality
  • Updated comment to correctly indicate the warning occurs during hydration, not SSR

Reviewed changes

Copilot reviewed 5 out of 5 changed files in this pull request and generated 1 comment.

Show a summary per file
File Description
src/index/use-swr.ts Changed hydration detection from returning different values to returning the same ref object with mutated content, preventing unnecessary re-renders
e2e/test/server-prefetch-warning.test.ts Added test to verify server prefetch warnings only appear during hydration when expected
e2e/test/initial-render.test.ts Added test to verify SWR doesn't cause extra re-renders
e2e/site/app/server-prefetch-warning/page.tsx Added test page to verify strictServerPrefetchWarning behavior
e2e/site/app/render-count/page.tsx Added test page to count renders and verify no extra re-renders occur

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

@shuding
Copy link
Copy Markdown
Member

shuding commented Jan 30, 2026

This hack is crazy (and you have snapshotted tweets?!)

@shuding shuding merged commit 1f93cc2 into main Jan 30, 2026
6 checks passed
@shuding shuding deleted the fix/extra-render branch January 30, 2026 17:55
@timtucker-dte
Copy link
Copy Markdown

Not sure what's happening, but in our client-side Next.js app we're seeing frequent failures to fetch data since this change.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Noticed useSWR rendering my component twice - even when not calling the fetcher

4 participants