vibecheck0.3.0
AI readinessaeocontent-requires-jswarning

Content only renders with JavaScript in Vanilla JS

When the HTML your server sends is an empty shell and all the content is painted by JavaScript in the browser, any crawler or agent that doesn’t execute JS — many AI answer engines, some social scrapers, low-power bots — sees a blank page. Client-only SPAs (a very common AI default with plain Vite/CRA) are invisible to exactly the audiences AEO is about.

Symptoms

  • "View source" shows an empty <div id="root"> and no real content
  • Answer engines and some crawlers can’t read or cite the page
  • Link previews (Slack, iMessage) are blank or show only the shell
  • VibeCheck reports almost no text in the raw server HTML

How VibeCheck catches it

In your widget · Problems

warningaeoContent only renders with JavaScript

To your coding agent · MCP

agent › get_detected_issues
{ detector: "aeo", issue: "Content only renders with JavaScript", threshold: "The raw server HTML contains fewer than 200 characters of body text" }

The same string in your widget and in your agent’s context — no screenshot, no copy-paste.

Root causes

  • A client-only SPA (Vite/CRA) that renders entirely in the browser
  • No SSR, SSG, or prerendering step in the build
  • Content fetched client-side after an empty initial paint

The fix for Vanilla JS

Render the HTML on the server (any templating layer) or generate static HTML files at build. Don’t rely on client JS to inject the primary content.

html
<!-- server-rendered: the content is already in the HTML -->
<main><h1>Real title</h1><p>Real content, present before any JS runs.</p></main>

Steps

  1. Adopt a framework mode that emits HTML (SSR or static generation)
  2. Ensure the primary content is in the server response, not fetched after load
  3. Verify with “view source” (or curl) that the text is present without JS

See the general, framework-agnostic fix →

FAQ

Doesn’t Google run JavaScript now?
Googlebot does render JS, but on a delay and with a budget, and many other crawlers and AI answer engines do not render at all. Server-rendered HTML is read immediately and universally — you shouldn’t rely on client rendering for content you want indexed and cited.
Is a noscript fallback enough?
A meaningful <noscript> block is better than nothing, but SSR/SSG is far more robust because it gives every consumer the full content. Treat noscript as a stopgap, not the fix.
How does VibeCheck detect this?
It re-fetches your page’s own URL and measures the text in the raw HTML the server returned. Under ~200 characters of body text means the content is being built client-side.