Vite Prerendering Architecture — Static Snapshots at Build Time
Single-page applications built with React offer unmatched user interface responsiveness, smooth page transitions, and great developer ergonomics. However, shipping an empty `<div id="root"></div>` HTML shell to web crawlers is an invitation for poor search engine indexing, missing social share previews, and penalized Core Web Vitals.
Rather than abandoning Vite to adopt a heavy full-stack framework with Node.js server dependencies, our portfolio employs a deterministic post-build prerendering engine. This architecture compiles static HTML snapshots directly into `dist/` during `npm run build`, ensuring that search engines encounter fully rendered content on the initial byte.
The static snapshot process runs immediately after Vite compiles production bundles. In `scripts/prerender-routes.cjs`, the script imports our centralized route manifest from `scripts/seo-routes.cjs`. For every public path — including the design gallery, engineering tabs, and individual writing articles — the script creates a dedicated folder with an `index.html` file.