# JavaScript SEO
JavaScript SEO is how search engines handle pages built or filled by JavaScript. If your content or links arrive only after scripts run, crawlers may miss them. This page shows what to fix and how to check it in minutes.
Updated 2026-09-14 · Source: https://porteur.ai/glossary/javascript-seo
## What JavaScript SEO means for a small site
JavaScript SEO covers how search engines handle pages built or filled by JavaScript. For a small site, it decides if your /pricing, /blog/how-it-works and /guides/getting-started get indexed, or sit unseen.
Googlebot renders pages with an evergreen Chromium in a second wave. Content that only exists after rendering may be indexed later, and when rendering fails, not at all. Bing renders some JavaScript. Most AI crawlers, such as OAI-SearchBot, PerplexityBot and ClaudeBot, do not execute it, so script-only text is invisible to them as of 2026.
## How Googlebot renders your pages
Google first crawls HTML, then queues the page to render. If the HTML already contains your product name, price, and copy, indexing is quick. If those arrive by script, indexing waits for the render queue and may fail if scripts block or error.
1. **Pick a key URL** Choose a template that matters for search, for example /features, /blog/your-post or a category page.
2. **Use Search Console’s URL Inspection tool** Enter the URL and view “HTML after JavaScript”. This is the rendered HTML Google saw.
3. **Check the critical bits exist in HTML** Look for the H1, body copy, product names, prices and internal links. If they are missing, fix your rendering path.
4. **Fetch a fresh crawl** If you ship a fix, request indexing once. Then monitor the Performance report for impressions on queries like “yourproduct pricing” or your post title.
> Rule: the HTML sent to the crawler should contain the content. Do not rely on client code to inject it.
## What breaks JavaScript SEO
- Links that are not anchors. Links must be elements with an href. Click handlers, buttons or divs are not crawled as links.
- Content behind clicks, scroll events or hash fragments. Googlebot does not trigger your “Load more” or read #tabs. Put the text in the HTML or provide real paginated URLs.
- Client side rendering only. A blank HTML shell relies on the render queue and can fail. Hydration without HTML content has the same risk.
- Blocked assets. If your scripts or APIs are blocked by robots.txt, Googlebot cannot render the page state.
- Race conditions. Data fetched after render or on user interaction never reaches the rendered HTML snapshot.
A fixed /pricing page returns HTML with the plan names and prices, and its “Start trial” and “Compare plans” links are and plus a real compare page at /pricing/compare.
> Warning: content that only exists after rendering may be indexed later, and when rendering fails, not at all.
## Framework choices that help
Server side rendering, static generation and hydration are the answers frameworks give. The goal is the same: ship HTML with the content, then enhance it with JavaScript.
| Approach | When to choose | What to check |
| --- | --- | --- |
| Static generation | Marketing pages, docs, blog | HTML includes copy and links, rebuild on publish |
| Server side rendering | Personalised or frequently updated pages | Fast TTFB and complete HTML on first response |
| Client side only | Prototypes or app-only areas after login | Use noindex or accept weak SEO reach |
Whatever you use, ensure internal navigation is real anchors with href to clean URLs, for example rather than a button with onClick. For infinite lists, use paginated URLs like /blog?page=2 and link to them.
## How to measure and iterate
- Rendered HTML parity: for each template, diff server HTML against the post-render DOM. Aim for the copy and links to match.
- Indexation: in Search Console, watch “Crawled, currently not indexed” and “Discovered, currently not indexed” for JS-heavy templates.
- Query coverage: in the Performance report, check impressions for exact titles, for example quotes around “How to use yourproduct”. No impressions means Google did not see the text.
- AI visibility: sample key pages with an AI crawler that does not execute JS. If it returns an empty body, your script-only text is invisible to them.
## Questions
### What is SEO in JavaScript?
It is making JavaScript-built pages readable and indexable by crawlers. You ensure the HTML sent to crawlers already contains the content and links, because Google renders later and most AI crawlers do not render at all.
### Is JavaScript still relevant in 2026?
Yes. You can ship fast, rich sites with JavaScript and rank. The constraint is how you render. Use static generation or server side rendering for public pages so crawlers see full HTML.
### Is JavaScript SEO friendly?
It is as friendly as your rendering path. Client side only is fragile for SEO because content arrives after scripts run. SSR or SSG with hydration gives you HTML for crawlers and interactivity for users.
### Which JavaScript framework is best for SEO?
Choose the mode, not the logo. Any framework that supports static generation or server side rendering can work. For search pages, prefer modes that output complete HTML and use real links for navigation.
### How do I fix links built with onClick?
Replace clickable divs or buttons with anchor elements that have href values to real URLs. Keep the onClick for tracking if you need it, but the crawler must have an to follow.
### How do I handle infinite scroll for SEO?
Expose paginated URLs such as /blog, /blog?page=2 and link to them with anchors. Keep infinite scroll for users, but let crawlers reach page 2, 3 and so on with real links.
## Read next
- [How to use the URL Inspection tool in Search Console](https://porteur.ai/guides/url-inspection-tool): Read each panel, run Test live URL, and know when to request indexing. Fix new pages, dropped pages, and canonicals Google ignores.
- [Technical SEO checklist for a small site](https://porteur.ai/guides/technical-seo-checklist): Run these 20 technical SEO checks, in order. Each shows how to check it free and what fixed looks like for a site under 1,000 pages.
- [Internal linking for a small site: which pages link to which](https://porteur.ai/guides/internal-linking-for-seo): Decide which pages rank. Build hubs, write clear anchors, fix orphans, and crawl your site to map links you control.
- [Indexation](https://porteur.ai/glossary/indexation): Indexation means a page is stored in Google’s index and can appear in search. Here is how to check status, read Page indexing, and fix what blocks it.
- [Orphan pages: finding the pages nothing links to](https://porteur.ai/guides/orphan-pages): Find orphan pages on your site, why they happen, how to compare crawl, sitemap and Search Console, and what to do: link, merge, redirect or remove.
- [robots.txt for AI crawlers: GPTBot, ClaudeBot, PerplexityBot and what to allow](https://porteur.ai/guides/robots-txt-for-ai-crawlers): Decide which AI crawlers to allow in robots.txt, why it matters, and copy‑paste examples for GPTBot, ClaudeBot, PerplexityBot, Google‑Extended and more.
- [Rendering](https://porteur.ai/glossary/rendering): Rendering is how Google executes your JavaScript and CSS after crawling HTML, which can delay indexing. Here is what to check and how to fix it.
- [JavaScript rendering: what Google sees, what the AI crawlers do not](https://porteur.ai/guides/javascript-rendering-and-seo): Google renders JavaScript in a second pass and the AI crawlers do not render it at all. Here is what breaks, how to test it, and what to change.
Paste your homepage URL to see if your public pages ship their copy and links in HTML, and which rivals already rank on those searches, in about thirty seconds. Free check: https://porteur.ai/