DEV Community

Peter Panda
Peter Panda

Posted on

Making a JavaScript-Heavy Site Readable for AI Crawlers: Prerendering Options Compared

Googlebot renders JavaScript, eventually. Many AI crawlers do not render it at all, or do so inconsistently. If your marketing site is a client-side single-page app, an AI assistant may see an empty shell and decide you have nothing to say. Here are the realistic options, from least to most work.

First, check what a crawler actually sees

curl -s -A "Mozilla/5.0 (compatible; GPTBot/1.0)" https://example.com/pricing | sed 's/<[^>]*>//g' | tr -s ' \n' | head -c 1500
Enter fullscreen mode Exit fullscreen mode

If the output does not contain your headline, prices and main copy, crawlers without rendering see nothing useful.

Option 1: Static generation for marketing pages

If you use Next.js, Nuxt, Astro, SvelteKit or similar, switch marketing routes (home, pricing, features, blog, docs) to static generation. This is the cleanest fix: the HTML contains the content, and the app can still hydrate on top.

Cost: low if the framework supports it; moderate if data fetching is tangled in components.

Option 2: Server-side rendering

Render on each request. Good for pages that change often, such as inventory or live pricing. More infrastructure and caching work than static generation.

Option 3: Prerendering service or middleware

A middleware detects bot user agents and serves a pre-rendered snapshot. This works but has drawbacks: you must maintain a bot list, snapshots go stale, and serving different content to bots and users needs care so it remains equivalent.

Option 4: Split the marketing site from the app

Many SaaS teams keep the product as an SPA and move the marketing site to a static generator or a CMS. This is often the best long-term choice: marketers can edit pages without touching the app, and crawlers get plain HTML.

Things that break even with rendering

  • Content hidden behind tabs that only load on click
  • Prices fetched from an API after load
  • FAQ answers injected by a chat widget
  • Infinite scroll without paginated URLs

Put critical facts in the initial HTML.

Do not forget robots and the CDN

Rendering is pointless if the CDN challenges bots. Check that your bot protection does not block the AI crawlers you want to allow, and that robots.txt is intentional.

A practical order of work

  1. Run the curl test on your top 10 pages.
  2. Move pricing, product and FAQ pages to static generation first.
  3. Re-test with curl.
  4. Check server logs for AI crawler hits over the next few weeks.

We explain why a single page now needs to answer many hidden sub-questions in our notes on query fan-out and AI crawlers. A page that cannot be read cannot be quoted, so rendering comes first.

Published by PandaWM, an overseas marketing team based in Hong Kong.

Top comments (0)