Skip to content

CSR-only Astro page

An Astro page where all meaningful content is inside a client:only component sends an empty HTML body to crawlers. Googlebot and AI crawlers receive no headings, no paragraphs, and nothing to index. The page does not appear in search results.

The correct fix is to add server-rendered content alongside the client component. Astro renders its own template on the server — the problem is when the template contains nothing but client:only components.

---
// src/pages/dashboard.astro — before
import Chart from '../components/Chart.jsx'
---
<html lang="en">
<body>
<Chart client:only="react" />
</body>
</html>
---
// src/pages/dashboard.astro — after
import Chart from '../components/Chart.jsx'
---
<html lang="en">
<head>
<title>Analytics Dashboard</title>
</head>
<body>
<h1>Analytics Dashboard</h1>
<p>Your traffic overview for the last 30 days.</p>
<Chart client:load />
</body>
</html>

If the component genuinely needs client:only, provide a fallback slot that renders in the server HTML.

<Chart client:only="react">
<p slot="fallback">Loading chart...</p>
</Chart>
Terminal window
curl https://yourdomain.com/your-page | grep '<h1'

Confirm the response body includes actual headings and content. Then re-run orino audit.