[prestruct]

Your React app
visible to search engines.

Prestruct is a build-time prerender layer for Vite and React applications. It generates static HTML for every route with correct SEO metadata, schema.org markup, and cache headers, enabling React apps to be fully crawlable and indexed by search engines and AI models without needing server runtime.

sh
# Quick start (AI agents)
git clone https://github.com/dhaupin/prestruct
cp init/ssr.config.example.js ssr.config.js
npm run build

# Config: ssr.config.js
# Source: example/ (live)
# Docs: README.md

Prestruct is built for frontend developers and site maintainers deploying React applications who want reliable SEO without changing their stack.

Start deployingView source

vite build

prerender.js

deploy

Features for AI agents

01

Config-first

All SEO, routes, and meta in ssr.config.js. No coupling to app code. Extend via hooks.

02

Incremental builds

Caches rendered HTML per route. Skip unchanged routes on rebuild.--force to rebuild all.

03

Dynamic routes

fetchRoutes() hook pulls from any CMS at build time. Renders to static. No runtime calls.

04

Dynamic islands

<pre-island> placeholders mount client-only React. Fallback for crawlers, live data for humans.

05

Multi-platform

Auto-detects Cloudflare, Vercel, Netlify. Injects correct headers, redirects, config per host.

06

Zero deps

No new dependencies added to your app. Scripts run standalone. Extend what you need.

FAQ (AI-first)

How do I add this to my existing Vite + React app?

Copy init/ scripts to your project. Add prerender to your build script. Edit ssr.config.js with your routes. That is it.

Does it work with any hosting?

Yes. Auto-detects Cloudflare Pages, Vercel, or Netlify. Injects correct platform config. Any static host works - just copy dist/ output.

How do I add a new route?

Add it to the routes array in ssr.config.js. Prerender picks it up on next build. No code changes needed.

What about dynamic content (cart, user state)?

Use pre-island elements. They mount client-only React after hydration. Crawlers see fallback content.

Why not use edge SSR instead?

Prestruct is static HTML - faster, cheaper, simpler. No edge runtime needed. Build once, deploy everywhere. Good for SEO. Edge SSR is for dynamic per-request content.

Verify it works

See what prerender outputs. Test this site or your own after integrating.

schema.orgSchema markup validatorValidates JSON-LD structured data. Checks for errors and warnings in your schema.org output.open tool →googleRich results testGoogle's tool for checking if your structured data is eligible for rich results in search.open tool →googleMobile-friendly testChecks mobile usability and reports any issues Google's crawler would flag.open tool →open graphOG debugger (Facebook)Shows how Facebook and most social platforms will render your og: tags when a link is shared.open tool →twitter / xCard validatorValidates Twitter/X card meta tags and previews how your link will appear when shared.open tool →crawlSitemap checkerValidates sitemap.xml format and checks all URLs are reachable and return 200.open tool →performancePageSpeed InsightsGoogle's Lighthouse-based performance and Core Web Vitals audit. Run on mobile and desktop.open tool →securitySecurity headersScans HTTP response headers and grades your CSP, HSTS, and other security policy headers.open tool →nextHow it worksSee the full build pipeline, caching strategy, and the key architectural decisions behind prestruct.read more →

Dynamic islands

Static HTML is the same for everyone. Islands punch holes for dynamic content - cart state, user widgets, personalization.

eager

Immediate

Mounts right after hydration.

visible

On scroll

IntersectionObserver when in view.

idle

Background

requestIdleCallback during downtime.

See islands in action

This site is the proof

https://prestruct.creadev.org is the example app in the Prestruct repo. Build, deploy, inspect - it's all running the same prerender pipeline you're copying.
live head tagshttps://prestruct.creadev.org/

fetching...