Что такое hydration mismatch и как его исправить?

Middle
268 просмотров
AFK Offer AI

Hydration mismatch — когда HTML с сервера не совпадает с тем, что React рендерит на клиенте. React выдаёт warning и перерендерит, что ломает производительность. Частые причины: Date.now(), Math.random(), window-зависимый код, расширения браузера, разные данные на сервере и клиенте. Решения: useEffect для клиентского кода, suppressHydrationWarning для дат, dynamic import с ssr: false, проверка typeof window. В Next.js — use client для компонентов с браузерным API.

Следующий вопрос

Что такое test coverage и нужно ли гнаться за 100%?