How Stackra Made a React App Visible to AI Without Next.js

If someone asks ChatGPT, Claude, or Perplexity about your business, the answer is built from what those tools can read in your raw HTML. If your homepage is a React SPA, that is almost nothing.

Run `curl -s https://yoursite.com | grep 'your headline'` and the headline is missing. The page is just a `<div id="root"></div>` and a script tag. AI crawlers reading that conclude your site has no content.

Nothing for a while. The site looked perfect in a browser, so the problem was invisible until we ran the same crawl an AI tool would.

A build-time step that visits every public page in a headless browser, waits for content to render, and saves the resulting HTML to disk. Production serves those static files directly. AI crawlers see the same content humans see.

Every marketing page on stackra.app now returns full HTML to direct fetches. Verifiable with `curl.exe -s https://stackra.app/about/ | Select-String 'Stackra'`: you get matches. Try the same command on a site that has not solved this and you get nothing back. No error, just silence. That silence is what Google and every AI crawler sees too. To see what a crawler actually receives, drop the filter: `curl.exe -s https://yoursite.com/`. If the output is a single line with a script tag and a `<div id="root"></div>`, your content is invisible to bots. If you see headings, paragraphs, and real text, you are in good shape. One more thing to check in that output: look for `<meta name="robots" content="noindex,nofollow">`. That tag tells every crawler not to index the page and not to follow its links. It is easy to leave in by accident from a staging environment, and any page carrying it will not appear in search results or AI citations regardless of how good the content is.

If your homepage shows live data (pricing, listings, stats, search results), prerendering it the naive way captures the loading spinner instead of the data. Crawlers index 'Loading...' and nothing else.

Our Benchmarks page tried to fetch from `/api/benchmarks/stats` during the build. The build server had no backend attached. Fetch failed. TanStack Query returned an empty state. We captured an 18KB shell with no grade bars, no scores, no industry data.

Two failed attempts. First we tried injecting JSON into the captured HTML after the fact: HTML is not React, so the data sat in a script tag and never made it into the page. Then we tried injecting data through Playwright's `addInitScript` so it was present before the page booted: TanStack Query treated the seeded data as stale and triggered a background refetch that timed out.

Add a single proxy route to the build-time static server. Any request to `/api/benchmarks/stats` during the build forwards to the live production API. Real data, real render, real captured HTML. We also considered intercepting the request inside the headless browser, or telling the data layer to never refetch. Both work. The proxy was cleanest because it matches what production actually does.

The Benchmarks page now prerenders with full content: grade distributions, pillar averages, and platform breakdowns all present in the raw HTML.

If your team adds new marketing pages over time, you will eventually deploy a page that works perfectly in the browser but is invisible to bots. The build does not warn you. The page just does not exist as far as crawlers are concerned.

We added seven marketing pages over a few months: the GEO page, four platform pages, privacy, and terms. Every one of them rendered fine in a browser. None of them were in the prerender route list. All seven were served as the SPA shell to anything that did not run JavaScript.

We caught this manually by running curl against each page and noticing the response was suspiciously small.

Centralize the route list in one place, then add a validation step at the end of every build that opens each captured file and checks three things: is it bigger than a minimum size, does it contain an `<h1>`, and does it contain the brand name. If any check fails, the build exits with an error.

The build now catches missing routes and silent renders before they ship. A captured file under 5KB for a marketing page or under 3KB for a blog article fails the build.