SSR ломается не в рендере, а в первом запросе к данным и гидрации

SSR ломается не в рендере, а в первом запросе к данным и гидрации

Если сервер и клиент собирают один и тот же экран, проблемы обычно прячутся в трёх местах: разные данные на старте, недетерминированный HTML и тяжёлые эффекты, которые запускаются до готовности DOM. Для Vue/Svelte/Astro это особенно заметно, когда компонент на сервере рендерится с одним состоянием, а в браузере тут же пересобирается уже с другим.

Проверь перед запуском:
— одинаковый вход для сервера и клиента: один и тот же props/state, без случайных значений;
— никакого доступа к window, document, localStorage в верхнем уровне модуля;
— форматирование дат, валют и списков должно быть одинаковым на обеих сторонах;
— если контент может отличаться, оборачивай его в явный клиентский блок, а не надеясь на «само совпадёт».

Отдельная ловушка — асинхронщина. Если сервер уже отдал HTML, а клиент потом делает второй запрос «на всякий случай», получаются мигание, лишний трафик и расхождение в разметке. Либо передавай готовые данные в страницу, либо делай клиентский рефетч только после загрузки и с понятным skeleton-состоянием.

Ещё один тест: открой страницу с выключенным JS. Если ключевой текст, навигация и CTA исчезли, это не SSR, а декорация. Хороший SSR должен давать полезный HTML сразу, а гидрация — добавлять интерактивность без сюрпризов.