Skip to content
Searchpedia SEO field notes Callum Bennett Callum

Site ops

SEO JavaScript

JavaScript SEO is about making sure your JS-powered pages still get crawled and indexed. I've seen too many sites lose rankings because critical content only appeared after render.

Beginner5 min readUpdated 2026-07-27Notes by Callum Bennett

What I’d do first

  • Check what Google sees with URL Inspection Tool before anything else.
  • Never block JS or CSS in robots.txt.
  • Critical SEO elements (title, meta, canonical, hreflang) must be in initial HTML.
  • Use HTML links, not JavaScript events, for navigation.
  • Consider SSR or pre-rendering for pages that are slow to render.

After a few audits where the rendered page was basically empty, I started treating JavaScript SEO as a checklist, not a mystery.

More on SEO JavaScript

Before anything else, I check what Google actually sees. Open Google Search Console, grab a URL from your site, and run it through the URL Inspection Tool. Look at the 'Page with indexing' section — that's what Googlebot rendered. If the title tag is missing, or the main content is just a loading spinner, you've got a problem. Next, I check robots.txt. I can't tell you how many times I've seen Disallow: /js/ or Disallow: /css/ in there. Google needs those resources to render. If you block them, you're basically asking Google to judge a book by its cover while blindfolded. Finally, I look at the page source (Ctrl+U, not the DOM). If your <title>, <meta name="robots">, <link rel="canonical">, or hreflang tags are missing from the raw HTML, that's a red flag. Those should be in the initial server response, not injected later.

The path I'd take

  1. Audit your critical SEO elements. Check that titles, meta descriptions, canonical tags, robots meta tags, hreflang, and structured data are in the initial HTML. If they're only added via JavaScript, move them server-side.
  2. Review your navigation. Make sure all internal links are standard <a href="..."> tags. No onclick handlers, no # fragments, no JavaScript routing that only works after the app loads. Googlebot follows links, not click events.
  3. Check your rendering strategy. If you're using client-side rendering (CSR) and your pages are slow to render or frequently show blank states, consider server-side rendering (SSR) or pre-rendering. Tools like Next.js or Nuxt make this easier than it used to be.
  4. Test lazy loading. Lazy loading images and iframes is fine, but don't lazy load your above-the-fold content or critical links. Google can handle lazy loading, but it's safer to have important stuff in the initial HTML.
  5. Use the History API for SPAs. If you're building a single-page app, use history.pushState() and clean URLs like /product/123, not hash-based URLs like /#/product/123. Hash URLs are not crawlable.
  6. Monitor rendering in Search Console. Keep an eye on the 'Coverage' report for any 'Crawled - currently not indexed' or 'Discovered - currently not indexed' issues. Those often point to rendering problems.

Watch-outs

  • Blocking JS/CSS in robots.txt. This is the most common mistake. Google needs your CSS to understand layout and your JS to execute the page. Blocking either can cause incomplete rendering.
  • JavaScript redirects. Using window.location or history.replaceState for redirects instead of HTTP 301/302. Google can follow JS redirects, but they're slower and less reliable.
  • Hash-based routing. If your SPA uses #! or #/ URLs, Google may not crawl them properly. Use the History API instead.
  • Injecting canonical or robots tags after render. If your canonical tag only appears after JavaScript runs, Google might index the wrong URL or miss the noindex directive entirely.
  • Over-relying on Google's rendering. Google's rendering queue can be slow. If your pages depend on complex JS to show content, they might sit in a queue for days or weeks before being indexed.

When to stop

You don't need to make every page a server-rendered masterpiece. If your site is a simple blog with minimal JS, you're probably fine. The threshold is: if your critical content, metadata, or links are invisible in the raw HTML, you need to fix that. If they're there, and your rendering is reasonably fast, you can stop.

Also, don't over-optimize. I've seen people pre-render every single page of a 10,000-page site when only the top 200 pages get any traffic. That's a waste of build time and server resources. Focus on the pages that matter for SEO — your money pages, your content hubs, your product pages.

Next step

SEO AuditRun a full SEO audit to catch JavaScript rendering issues early.

Quick answers

Does Google use JavaScript?

Yes, Google can render JavaScript, but pages still need crawlable URLs, accessible resources, and meaningful server responses for reliable indexing.

Is JavaScript bad for SEO?

No, JavaScript is not inherently bad for SEO. The risk comes from poor implementation, such as hiding critical content or metadata behind JavaScript that search engines may not render reliably.

Should I block JavaScript in robots.txt?

No. Blocking JS or CSS in robots.txt can prevent Google from rendering your page properly, which may hurt indexing.

Where to go next

More from Site ops

A step sideways

Sources

Primary documentation is linked directly. Anything commercial is marked nofollow.

Notes from Callum Bennett.