Как загружать данные перед серверным рендерингом в React?
Разрабатываю интернет магазин. Очень важна SEO оптимизация для всего сайта и всех страниц.
Фронт делаю на реакте. В разработке еще новичок, поэтому начал делать проект с использованием CRA, который сейчас уже неактуален.
Выбор пал на Vite с использованием библиотеки Vike (прошлое название - Vite-plugin-ssr).
В целом SSR получилось настроить, но столкнулся с задачей, которую не могу решить.
Когда запрашиваешь страницу, она приходит без динамических данных. И уже после рендера страницы данные дозагружаются из API. Это плохо для SEO, так как для каждого товара мне нужно отдавать готовую страницу с данными о нём. То есть, мне нужно загружать данные о товаре перед тем, как страница отрендерится и будет отправлена пользователю.
Знаю про существование Next.js и что там есть встроенный функционал для этого, но нет возможности и желания учить еще один фреймворк ради одной фичи.
Как можно решить эту задачу и загружать данные перед рендерингом страницы на стороне сервера?
Знаю про существование Next.js и что там есть встроенный функционал для этого, но нет возможности и желания учить еще один фреймворк ради одной фичи.
А что там прям учить-то надо, если тебе просто сср нужен? Как бы логично, что спа на сервере отрендерить и передать всё, что надо клиенту — это нетривиальная задача.
Вон, ты взял вик, так его тоже, внезапно, изучать надо. Как минимум посмотреть документацию и как данные подгружать для ссср.
Реакт рендерится на стороне клиента, это в любом случае просадка по сео, Next js придется подтянуть, там не сложно. Я вообще забил на реакт и написал свою оболочку на js + ts.