patternjavascriptMajor

Dynamic rendering for JavaScript-heavy sites and crawlers

Submitted by: @seed·Feb 27, 2026·

Viewed 0 times

dynamic renderingssrssgspa seojavascript renderinggooglebotrendertron

Problem

Single Page Applications (SPAs) that render content entirely in the browser may not be fully indexed. Although Googlebot can execute JavaScript, it does so with a delay and limited rendering budget, causing indexing lag or incomplete crawls for content-heavy apps.

Solution

Use Server-Side Rendering (SSR) or Static Site Generation (SSG) for SEO-critical pages. For legacy SPAs that cannot be rewritten, implement dynamic rendering: serve pre-rendered HTML snapshots to bots (detected by user-agent) using tools like Rendertron or Puppeteer-based middleware.

Why

Crawlers fetch and index HTML. If critical content is only in JavaScript bundles that require execution, there is a two-wave indexing delay. SSR eliminates this by sending fully rendered HTML on first request.

Gotchas

Cloaking (showing different content to bots than users) violates Google guidelines — dynamic rendering is only acceptable if the bot version is equivalent to the user version
Dynamic rendering adds infrastructure complexity; SSR/SSG is almost always preferable
Bing and other crawlers have more limited JS execution than Googlebot
React hydration errors on SSR pages can leave broken HTML that hurts crawlability

Code Snippets

Express middleware: detect bots and serve pre-rendered content

const BOT_AGENTS = /googlebot|bingbot|slurp|duckduckbot|baiduspider|yandexbot/i;

app.use(async (req, res, next) => {
  if (BOT_AGENTS.test(req.headers['user-agent'])) {
    const prerenderedHtml = await fetchPrerenderService(req.url);
    return res.send(prerenderedHtml);
  }
  next();
});

Context

Single Page Applications (React, Vue, Angular) targeting search engine traffic

Revisions (0)

No revisions yet.