Skip to content

JavaScript SEO

Also called JS SEO

What is javaScript SEO?

JavaScript SEO is the part of technical SEO that makes sure search engines can find, render and index pages built with JavaScript. It covers how content, links and metadata get into the page, whether bots can see them without interaction, and how frameworks such as React, Vue, Angular, Next.js and Nuxt deliver HTML.

A plain HTML page holds its content in the response the server sends. A JavaScript-heavy page may send an almost empty HTML shell and build the content in the browser. For a person in a modern browser the result looks the same. For a crawler it is not: the content only exists after the crawler downloads the scripts, runs them and waits for any API calls they make.

Google handles this in stages. Googlebot crawls the URL and reads the raw HTML. Pages then go into a queue for rendering, where Google’s Web Rendering Service runs the page in an evergreen version of Chromium. Only after rendering can Google see content and links that JavaScript added. Google’s documentation says most pages are rendered quickly, but rendering still costs resources, and anything that fails during it, such as a blocked script, a timed-out API call or an error, can leave Google with a blank page.

Other crawlers are less capable. Many AI crawlers and some smaller search engines fetch the HTML and do not run JavaScript at all, so content that only appears after scripts run can be invisible to them. Social platforms that build link previews from Open Graph tags usually read the raw HTML too.

The common problems are predictable. Links built as click handlers on buttons or spans instead of real <a href> elements, which Google does not follow. Content that only loads after a click, a scroll or a tab change. Titles, canonicals and meta robots tags that differ between the raw HTML and the rendered page. Single-page apps that return a 200 status for every route, including ones that should be 404, which produces soft 404s. URLs that use # fragments for different views, which Google treats as the same page. And JavaScript or CSS files blocked in robots.txt, which stops Google rendering the page properly.

Why javaScript SEO matters

If Google cannot render a page, it cannot index what is on it. A product page whose description and price arrive through a failed API call is, as far as search is concerned, a page with no description and no price. Internal links that only exist after JavaScript runs slow down discovery, because Google cannot follow them until the page has been rendered.

Search is also no longer one crawler. AI assistants and answer engines pull from the web through their own fetchers, and many of them read only raw HTML. A site that serves real content in the initial HTML is visible to all of them; a site that relies on client-side rendering is visible to fewer.

Finally, JavaScript affects speed. Large bundles delay rendering and interaction, which shows up in Core Web Vitals, especially LCP and INP.

How to audit JavaScript SEO

  1. Compare the raw HTML with the rendered page. View the source (not the DevTools Elements panel) and check whether the main content, title, meta description, canonical and links are there before JavaScript runs.
  2. Use the URL Inspection tool in Search Console and open “View crawled page” to see the HTML Google rendered and any resources it could not load.
  3. Check that every link you want crawled is an <a> element with an href attribute that holds a real URL, not a # or javascript: value.
  4. Make sure each view has its own URL using the History API, not a # fragment, and that missing routes return a real 404 status or a noindex tag.
  5. Do not block the JavaScript, CSS or API endpoints the page needs in robots.txt.
  6. Keep critical tags consistent. If the raw HTML says noindex and JavaScript removes it, Google may never render the page to see the change.
  7. For important templates, prefer server-side rendering or static generation so the content is in the first response. Google no longer recommends dynamic rendering (serving bots a separate pre-rendered version) as a long-term fix.
  8. Crawl the site with a crawler that can run in both modes and compare the results: pages whose word count or link count jumps after rendering depend on JavaScript.

JavaScript SEO example

A link Google can follow, and one it cannot
<!-- Crawlable: a real URL in an href -->
<a href="/shoes/trail">Trail shoes</a>

<!-- Not crawlable: no href, navigation happens in a script -->
<span onclick="goTo('/shoes/trail')">Trail shoes</span>

JavaScript SEO FAQ

Can Google crawl JavaScript?

Yes. Googlebot renders pages with an up-to-date version of Chromium, so it can see content JavaScript adds. It does not click, type or scroll like a person, and anything that fails during rendering is lost.

Is JavaScript bad for SEO?

No, but it adds steps that can go wrong. Sites that put their main content and links in the server’s HTML response avoid most of the risk, whichever framework they use.

Do AI crawlers render JavaScript?

Many do not. They fetch the HTML and read what is there, so content that only appears after scripts run may never reach AI assistants. Server-side rendering or static generation solves this.

Is dynamic rendering still recommended?

No. Google describes dynamic rendering as a workaround rather than a long-term solution and recommends server-side rendering, static rendering or hydration instead.

Related SEO terms

  • Rendering

    Rendering is when a search engine runs a page’s HTML, CSS and JavaScript to build the page as a browser would, so it can see the final content.

  • Server-side rendering (SSR)

    Server-side rendering (SSR) builds a page’s full HTML on the server for each request, so browsers and crawlers get the content in the first response.

  • Client-side rendering (CSR)

    Client-side rendering (CSR) sends a near-empty HTML page and builds the content in the browser with JavaScript, which crawlers must run to see it.

  • Googlebot

    Googlebot is Google’s web crawler. It fetches pages so Google Search can index them, using a smartphone crawler for most sites.

  • Crawling

    Crawling is how search engines discover pages: automated bots fetch URLs and follow the links on them to find more pages.

  • Lazy loading

    Lazy loading delays loading images, iframes or other content until they are about to scroll into view, which speeds up the first load of a page.

  • AI crawlers (GPTBot, ClaudeBot)

    AI crawlers are bots that AI companies use to collect web content for model training or for AI search answers, such as GPTBot and ClaudeBot.

  • Soft 404

    A soft 404 is a page that returns a 200 success code but looks like an error or empty page, so Google treats it as not found.

Back to the SEO glossary

Put the terms to work

Every term here is something OpenSEO measures. It is open source: start online in a minute, or run it on your own server.