Rendering (рендеринг) — це процес перетворення коду сторінки (HTML, CSS, JavaScript) на видиме й інтерактивне зображення, яке бачить користувач у браузері. Пошукові системи теж рендерять сторінки: Googlebot виконує JavaScript, щоб «побачити» кінцевий контент так само, як людина, перш ніж додати сторінку до індексу.
Простими словами: код — це рецепт, а рендеринг — приготування страви. У браузері «страву» їсть користувач, а на кухні Google куштує її робот, щоб зрозуміти, що ви взагалі подаєте.
Що таке рендеринг і навіщо він важливий для SEO
Довгий час пошуковики читали переважно «сирий» HTML. Сьогодні сайти масово підвантажують контент через JavaScript, тож Google додав окремий етап — рендеринг. Спершу сторінку сканують, потім ставлять у чергу на відмальовування, і лише після виконання JS Googlebot бачить фінальний контент. Якщо важливий текст з’являється тільки після рендерингу, а він зривається — Google може проіндексувати порожню сторінку.
Саме тому рендеринг — ключове поняття JavaScript SEO. Розробники обирають, де «збирати» сторінку: на сервері чи в браузері користувача. Від цього залежить, наскільки швидко й надійно Googlebot дістанеться до контенту.
Види рендерингу
- Server-Side Rendering (SSR) — сторінка збирається на сервері, у браузер і до робота приходить готовий HTML. Найнадійніше для SEO.
- Client-Side Rendering (CSR) — контент домальовує JavaScript уже в браузері. Гнучко, але ризиковано, якщо робот не виконає скрипт.
- Dynamic Rendering — роботам віддають готовий HTML, людям — JS-версію. Компромісний, перехідний варіант.
Приклад
Інтернет-магазин на JavaScript-фреймворку віддає порожній <div>, а картки товарів домальовує скрипт уже в браузері. Користувач усе бачить, а от Googlebot до рендерингу отримує майже пусту сторінку. Перевели рендеринг товарів на сервер (SSR) — і контент почав індексуватися стабільно.
Часто плутають з…
- Індексація — це збереження вже «побаченого» контенту в базі; рендеринг іде раніше й лише готує цей контент.
- Сканування (crawling) — це завантаження коду сторінки; рендеринг — його виконання й перетворення на видиме зображення.
Питання та відповіді
Чи рендерить Googlebot JavaScript?
Так. Google виконує JavaScript на окремому етапі рендерингу, але робить це з чергою й затримкою, тож критичний контент краще не ховати виключно за скриптами.
Який рендеринг найкращий для SEO?
Найнадійніший — серверний (SSR): робот одразу отримує готовий HTML. Client-Side Rendering працює, але потребує уваги, щоб контент точно виконався для Googlebot.
Чим рендеринг відрізняється від індексації?
Рендеринг перетворює код на видимий контент, а індексація зберігає цей контент у базі пошуковика. Спочатку рендеринг — потім індексація.
Контент на JS не індексується? Розберемо рендеринг вашого сайту — технічний SEO-аудит та виправлення помилок на сайті.
Схожі терміни: JavaScript SEO, Client-Side Rendering, Render Blocking, Googlebot, Індексація.