mirror of
https://github.com/bitsocialnet/5chan.git
synced 2026-08-03 07:41:04 +02:00
Tommaso CasaburiandGitHub
a92b185a66
* chore(ai-workflow): track repo-managed review tooling * fix(ai-workflow): remove repo-specific path assumptions Make shared workflow hooks and APK testing guidance resolve paths from the repo and contributor environment so the tooling works for all contributors, not just one machine.
31 lines
872 B
Markdown
31 lines
872 B
Markdown
---
|
||
title: Suppress Expected Hydration Mismatches
|
||
impact: LOW-MEDIUM
|
||
impactDescription: avoids noisy hydration warnings for known differences
|
||
tags: rendering, hydration, ssr, nextjs
|
||
---
|
||
|
||
## Suppress Expected Hydration Mismatches
|
||
|
||
In SSR frameworks (e.g., Next.js), some values are intentionally different on server vs client (random IDs, dates, locale/timezone formatting). For these *expected* mismatches, wrap the dynamic text in an element with `suppressHydrationWarning` to prevent noisy warnings. Do not use this to hide real bugs. Don’t overuse it.
|
||
|
||
**Incorrect (known mismatch warnings):**
|
||
|
||
```tsx
|
||
function Timestamp() {
|
||
return <span>{new Date().toLocaleString()}</span>
|
||
}
|
||
```
|
||
|
||
**Correct (suppress expected mismatch only):**
|
||
|
||
```tsx
|
||
function Timestamp() {
|
||
return (
|
||
<span suppressHydrationWarning>
|
||
{new Date().toLocaleString()}
|
||
</span>
|
||
)
|
||
}
|
||
```
|