JavaScript и SEO: индексация SPA и сайтов на JS

Сайты на React, Vue и других JS-фреймворках красивы и интерактивны, но создают для SEO особую проблему: поисковый робот может увидеть вместо контента пустую страницу. Если сайт рендерит содержимое в браузере скриптом, а сервер отдаёт «голый» HTML, поиск рискует не проиндексировать то, что видит пользователь. Разберём, почему так происходит, чем отличаются подходы к рендерингу (CSR, SSR, SSG, предрендеринг) и как убедиться, что робот видит ваш контент.

В чём проблема JS-сайтов для SEO

Классический сайт отдаёт готовый HTML с контентом сразу. SPA (одностраничное приложение) часто работает иначе: сервер присылает почти пустой HTML и скрипт, который уже в браузере подгружает данные и строит страницу. Проблема в том, что:

• робот получает пустую или неполную страницу, а контент появляется только после выполнения JS;
• рендеринг JavaScript для поиска — это дополнительный, отложенный и не гарантированный этап;
• если что-то мешает выполнению скрипта, контент не индексируется вовсе.

Итог: пользователь видит полноценную страницу, а поиск — пустышку. Это одна из скрытых причин, по которым сайт «не индексируется», разобранных в материале про индексацию сайта.

Как поиск рендерит JavaScript

Современные поисковики умеют выполнять JS, но с оговорками. Google рендерит страницы в две волны: сначала обходит HTML, потом, когда есть ресурсы, возвращается и выполняет скрипты. Этот второй этап откладывается и не всегда происходит быстро. Яндекс исторически хуже работает с тяжёлым клиентским JS, чем Google.

Практический вывод: полагаться на то, что поиск «сам всё отрендерит», рискованно. Чем важнее контент, тем меньше он должен зависеть от выполнения JS на стороне робота. Надёжнее отдавать готовый HTML.

CSR, SSR, SSG, предрендеринг

Существует несколько подходов к рендерингу, и выбор напрямую влияет на индексацию.

• CSR (чистый клиентский рендеринг) — худший вариант для SEO;
• SSR — сервер отдаёт готовую страницу, робот видит контент сразу;
• SSG — страницы генерируются заранее в статический HTML, идеально для контентных сайтов;
• предрендеринг — генерация готового HTML специально для поисковых ботов.

Для SEO-ориентированного проекта выбирают SSR, SSG или предрендеринг, а не чистый CSR.

Решения для существующего SPA

Если сайт уже на чистом CSR и плохо индексируется, есть пути исправления:

1. перевести на SSR/SSG — фреймворки (Next.js, Nuxt и аналоги) поддерживают серверный рендеринг и статическую генерацию;
2. настроить предрендеринг — отдавать ботам заранее отрисованный HTML;
3. гибридный подход — критичный для SEO контент отдавать в HTML, интерактив оставить на JS.

Ключевой принцип: важный для поиска контент (тексты, заголовки, ссылки, мета) должен присутствовать в исходном HTML, а не появляться только после выполнения скрипта.

Частые ошибки JS-SEO

• контент только в JS — робот видит пустую страницу;
• ссылки не в виде <a href> — навигация на onclick/JS не передаёт вес и не обходится;
• soft-404 в SPA — приложение на любой адрес отдаёт код 200 с оболочкой, включая несуществующие (о вреде — в материале про ошибки 404);
• мета-теги не меняются между «страницами» SPA — у всех одинаковые title;
• блокировка JS в robots.txt — робот не может отрендерить страницу;
• медленный рендер — тяжёлый JS ухудшает скорость и INP.

Особенно коварна ситуация с мета: если SPA не подставляет уникальные title и description для разных маршрутов, поиск видит все страницы одинаковыми.

Как проверить, что видит робот

Нельзя полагаться на то, как страница выглядит в браузере, — важно, что получает поиск. Способы проверки:

• посмотреть исходный HTML (не отрендеренный DOM, а то, что отдаёт сервер) — есть ли там контент;
• инструменты проверки URL в Google Search Console и Яндекс Вебмастере — показывают, как поиск видит и рендерит страницу;
• отключить JavaScript в браузере и открыть страницу — увидите примерно то, что видит робот без рендеринга;
• проверить индексацию конкретных текстов через поиск по кусочку фразы.

Если при отключённом JS страница пустая, а в исходном HTML нет контента — у сайта проблема с JS-SEO, которую нужно решать рендерингом.

Когда индексация решена, а роста нет

Правильный рендеринг убирает барьер — робот видит контент, страницы индексируются. Но это возвращает сайт в нормальные условия, а не даёт рост сверх них. Когда контент доступен поиску, а страница конкурирует за топ, решает поведение. Здесь помогает работа с поведенческими факторами: сервис TopBooster приводит на страницы живой трафик из поиска и усиливает сигналы качества. Рендеринг открывает контент поиску, а поднимают страницу содержание и поведение.

Частые вопросы

Почему сайт на React или Vue плохо индексируется? Потому что при чистом клиентском рендеринге (CSR) сервер отдаёт почти пустой HTML, а контент строит скрипт уже в браузере. Робот получает пустышку, а рендеринг JS для поиска — отложенный и негарантированный этап. Пользователь видит страницу, а поиск — нет. Решается серверным рендерингом или статической генерацией.

Что лучше для SEO — CSR, SSR или SSG? Для SEO лучше SSG (статическая генерация, готовый HTML заранее) или SSR (серверный рендеринг при запросе) — робот получает контент сразу. Чистый CSR (клиентский рендеринг) хуже всего, так как контент скрыт от робота до выполнения JS. Предрендеринг — рабочий компромисс для существующих SPA.

Рендерит ли Яндекс JavaScript? Частично, но хуже, чем Google, и полагаться на это рискованно. Чем важнее контент, тем меньше он должен зависеть от выполнения JS роботом. Надёжнее отдавать готовый HTML через SSR, SSG или предрендеринг, чтобы контент, заголовки, ссылки и мета были в исходном коде страницы.

Как проверить, что робот видит контент SPA? Посмотреть исходный HTML, который отдаёт сервер (а не отрендеренный DOM), отключить JavaScript в браузере и открыть страницу, использовать инструменты проверки URL в Search Console и Яндекс Вебмастере. Если без JS страница пустая и в исходном HTML нет текста — у сайта проблема с JS-SEO.

Вывод

JavaScript создаёт для SEO риск: при клиентском рендеринге робот видит пустую страницу вместо контента. Поиск умеет выполнять JS, но это отложенный и негарантированный этап, а Яндекс делает это хуже Google. Поэтому важный контент должен быть в исходном HTML — через SSR, SSG или предрендеринг, а не появляться только после скрипта. Избегайте частых ошибок: контента только в JS, ссылок не через <a href>, soft-404, одинаковых мета в SPA. Проверяйте, что видит робот, отключив JS и посмотрев исходный код. Рендеринг открывает контент поиску, а поднимает страницу поведение — оценить нужную поддержку можно на странице тарифов.