Skip to content

How JavaScript rendering affects SEO

SEO1 min readFixes 2 checks js-seo-tags-changed, js-rendered-content-diff

Content that only appears after JavaScript runs is indexed later and less reliably. Server-render what must rank.

Step by step, with screenshots: Can AI crawlers execute JavaScript? Which ones render and which do not →

Check your own site

Runs these 2 checks and the other 191, free, in about 45 seconds.

Or run only this check with the free JavaScript SEO audit, the free AI crawlers check or the free AI visibility checker.

What it is

JavaScript rendering is when a page's content, links or tags are created by scripts in the browser instead of arriving in the HTML the server sends. Search engines then have to run those scripts to see the page, which Google does in a separate, later step with a limited budget.

Google usually renders JavaScript fine, but content can be indexed later or missed when scripts fail, time out or wait for a click. Most AI crawlers and link-preview bots do not run JavaScript at all, and a title, canonical or noindex changed by scripts gives Google two different instructions.

OK looks like this: the main text, headings, links and SEO tags are in the server's HTML, and scripts only add interactivity. getReport compares the raw HTML with the rendered page and reports how much visible text appears only after JavaScript runs.

What a passing site looks like

  • JavaScript leaves the title, canonical and robots tags alonefail · −6 ptseffort M
  • The visible text is present without JavaScriptwarning · −1.5 ptseffort L

1. SEO tags changed by JavaScript

Why it matters. Search engines read the HTML first and the rendered page later, if at all. A canonical or noindex that JavaScript changes sends two different instructions, and Google may act on either.

How to fix it.
  1. Put the final title, description, canonical and robots tags in the HTML the server sends.
  2. In a single-page app, set them on the server for each route (Next.js metadata, Nuxt useHead with SSR, Angular Universal).
  3. Never add noindex with JavaScript to a page you want indexed; Google may drop it before the script runs.

2. Content that needs JavaScript

Why it matters. Google renders JavaScript later and with a budget, so text that only appears after scripts run can be indexed late or not at all. Other search engines and link previews may never see it.

How to fix it.
  1. Serve the main content in the HTML (server-side rendering or static generation) and use JavaScript only to enhance it.
  2. Check the difference in the technical detail; menus and widgets are fine, headlines and body copy are not.

Questions people ask

Can AI crawlers execute JavaScript?

Mostly no. Crawlers such as GPTBot, ClaudeBot and PerplexityBot generally read the raw HTML without running scripts, so content that only appears after JavaScript is invisible to them. Google's crawler does render JavaScript. Serve important content in the initial HTML if you want AI tools to read it.

How do you make JavaScript SEO friendly?

Render the main content on the server, with server-side rendering or static generation, and use JavaScript to enhance it. Use real <a href> links, set title, description, canonical and robots tags in the server HTML, and avoid content that loads only after a click or scroll. Then compare the raw and rendered HTML.

What is JavaScript SEO?

JavaScript SEO is the part of technical SEO that makes sure search engines can crawl, render and index sites built with JavaScript frameworks such as React, Vue or Angular. It covers rendering strategy, crawlable links, metadata set on the server and checking what Googlebot actually sees.

Does Google index JavaScript content?

Yes, Google renders pages with a current version of Chrome and indexes content created by JavaScript. It does this after the first crawl, sometimes with a delay, and skips content that needs user interaction or fails to load. Other search engines render less reliably, so server-rendered content is the safer choice.

Filed under Technical SEO. Copy is generated from the same catalogue that scores every report, so what you read here is what the report says.