JavaScript rendering
JavaScript rendering is the process in which a browser or crawler runs a page's JavaScript to build the content a visitor sees. Googlebot renders JavaScript with an up-to-date Chromium, but AI crawlers such as GPTBot, OAI-SearchBot, ClaudeBot and PerplexityBot do not, so content that only appears after scripts run is invisible to them.
Why JavaScript rendering matters for AI search
In a December 2024 study, Vercel and MERJ analyzed crawler traffic across Vercel's network and found that none of the major AI crawlers render JavaScript: not OpenAI's GPTBot, OAI-SearchBot or ChatGPT-User, not Anthropic's ClaudeBot, not PerplexityBot. They do download script files, which made up 11.50% of ChatGPT's fetches and 23.84% of Claude's, but they never run them. Google's Gemini is the exception, because it relies on Googlebot's infrastructure. Microsoft Copilot was left out of the study for lack of a distinct user agent. It answers from Bing's index, and Bing says Bingbot uses a rendering engine kept current with Microsoft Edge.
So a site built as a single-page app can rank well in Google and still look empty to the crawlers of OpenAI, Anthropic and Perplexity.
How JavaScript rendering works
A page reaches a crawler in one of two shapes:
- Server-rendered or static. The HTML the server sends already contains the text, links and prices. Every crawler can read it.
- Client-rendered. The server sends a near-empty shell and a bundle of scripts. A browser runs the scripts, fetches data and builds the page. A crawler that doesn't run JavaScript only sees the shell.
Googlebot handles the second case in two passes. It crawls the HTML, queues the page, then renders it with headless Chromium "once Google's resources allow", which can take seconds or longer. Even so, Google advises server-side or pre-rendering, "and not all bots can run JavaScript." Vercel adds one nuance: data shipped inside the first HTML response, such as JSON, may still be read.
Example: a feature page that AI crawlers see as empty
A buyer asks ChatGPT: "Does Acme Invoice support recurring invoices in euros?" Acme's features page is a client-rendered app. Its first HTML response holds little more than <div id="root"></div> and a script tag. Googlebot renders it and indexes the feature list. GPTBot and OAI-SearchBot receive the empty div and have nothing on that page to quote. ChatGPT can still answer, but from other pages, possibly a competitor's comparison. If Acme server-renders the feature list, the same text sits in the first response, and every crawler, Googlebot or not, reads the page the way a visitor does.
How to fix JavaScript rendering for AI crawlers
- Look at the raw HTML. Use "view source" or a command-line request, not the browser's inspector, which shows the rendered page.
- Server-render what matters. Vercel recommends it for main content, titles and descriptions, and navigation, keeping client-side rendering for extras like chat widgets or view counters.
- Keep links as real links. Google can only follow
<a>elements with anhref.
Once the content is in the HTML, make sure the crawlers are allowed in: Hawkscan's action plan flags an AI crawler your robots.txt blocks. For the other blockers, see crawlability.
Sources
- Vercel, The rise of the AI crawler ()
- Google Search Central, Understand the JavaScript SEO basics ()
- Google Search Central, Optimizing your website for generative AI features on Google Search ()