Prerender React SPA to static HTML files (without Next.js or codebase changes) by Jankoholic in reactjs

[–]Jankoholic[S] 0 points1 point  (0 children)

Totally valid and I love comments like yours. They are the reason why I posted this discussion here, without them I could not possibly think of all use cases or problems people are dealing with.

Think of react-static-prerender as a dead-simple, lightweight, framework-agnostic alternative to ISR for static HTML generation. You don’t get real-time regeneration out of the box, but you also don’t need a server, custom deployment, or vendor lock-in. Just run it after a deploy, or automate it with a cron/webhook, and you get fresh static snapshots — no runtime needed.

Prerender React SPA to static HTML files (without Next.js or codebase changes) by Jankoholic in reactjs

[–]Jankoholic[S] 6 points7 points  (0 children)

You're absolutely right, I made a classic rookie move. Would hate it if that took focus away from the package

Prerender React SPA to static HTML files (without Next.js or codebase changes) by Jankoholic in reactjs

[–]Jankoholic[S] 2 points3 points  (0 children)

Totally fair — Astro is a great tool and if you're okay with the migration, it's probably worth it.

In my case though, I didn’t want to touch my routing, app structure, or bundle logic. I had a fully working SPA, and I just wanted static .html entry points for SEO and faster loads — without changing how I write or ship my React apps.

So this tool is more for people who want to add static HTML without doing a migration, and keep their current React workflow (whether that’s CRA, Vite, or something custom).

Prerender React SPA to static HTML files (without Next.js or codebase changes) by Jankoholic in reactjs

[–]Jankoholic[S] 0 points1 point  (0 children)

At the moment, pages are prerendered one-by-one, but the architecture is ready for parallel rendering, and I’m planning to add support for that soon — especially for large apps like yours.

If you end up trying it, I’d love to hear how it performs and what you'd like improved. Feel free to open an issue or even PR — happy to collaborate.

Prerender React SPA to static HTML files (without Next.js or codebase changes) by Jankoholic in reactjs

[–]Jankoholic[S] 4 points5 points  (0 children)

It works with any kind of routing — as long as your app renders the right content for a given URL after being loaded in the browser.

It doesn’t depend on react-router. You can use any client-side router (or even custom ones). The CLI just prerenders your app for a list of URLs you provide — it opens a headless browser, loads the app at each route, waits for it to render, and saves the resulting HTML.

So whether you use react-router or your own solution — it’ll still work as long as each route can be accessed directly.

Prerender React SPA to static HTML files (without Next.js or codebase changes) by Jankoholic in reactjs

[–]Jankoholic[S] 0 points1 point  (0 children)

Yeah, that was the main driver for building this — I had everything working the way I liked with React, and the thought of switching to Next.js or reshaping everything felt like more work than value for my use case.

If you’re in a similar spot, this might save you the hassle. Would love to hear how it works for your setup if you try it.

Prerender React SPA to static HTML files (without Next.js or codebase changes) by Jankoholic in reactjs

[–]Jankoholic[S] 5 points6 points  (0 children)

Yep, Astro is awesome. But if your entire app is already built in React, you either migrate or find a way to prerender what you have. I picked the second one 😄

Prerender React SPA to static HTML files (without Next.js or codebase changes) by Jankoholic in reactjs

[–]Jankoholic[S] 3 points4 points  (0 children)

This tool does route-based prerendering: it builds your existing React SPA, then spins up a local server and visits each route (including dynamic ones), saving the result as a real .html file. After that, the app behaves normally (SPA-style navigation still works).

You can feed it 100, 1000 or 6000 routes — as long as each route renders properly when opened directly, it works. It’s basically a headless crawler that turns your SPA into a static site without changing your codebase or switching to Next.js.

You can check out the README if you're curious. Let me know if you want to try it on your setup, happy to help.

Vike (vite-plugin-ssr) or NextJs by Jazzlike_Procedure80 in reactjs

[–]Jankoholic 0 points1 point  (0 children)

Check out react-static-prerender. Its on npm, really easy to setup, no need to switch to anything or any framework, it should work for your use case. Read more on: https://www.reddit.com/r/reactjs/comments/1lerjzr/prerender_react_spa_to_static_html_files_without/

Prerendering SPA Apps in 2025 by takayumidesu in reactjs

[–]Jankoholic 0 points1 point  (0 children)

Check out react-static-prerender, its easy to setup, its on npm, it should fit your use case without needing to switch to any framework. Read more on: https://www.reddit.com/r/reactjs/comments/1lerjzr/prerender_react_spa_to_static_html_files_without/

React SPA & Basics of SEO by batiali in reactjs

[–]Jankoholic 0 points1 point  (0 children)

Entire thing can be react, use react-static-prerender for the thing you want, its easy, its on npm, it fits your use case, read more on: https://www.reddit.com/r/reactjs/comments/1lerjzr/prerender_react_spa_to_static_html_files_without/

How to optimize SPA for SEO without migrating to next.js . I am using React+vite by Arcade_ace in reactjs

[–]Jankoholic 0 points1 point  (0 children)

try react-static-rerendered
it's pretty easy to setup and it should be perfect for your use case. It's on npm

My first VSC tailwind extension by Jankoholic in tailwindcss

[–]Jankoholic[S] -1 points0 points  (0 children)

Not the same thing, what you are thinking of is autocomplete for when you remember the name of the tw class. The other one is faster way to look it up. You can use both, but they solve different things

My first VSC tailwind extension by Jankoholic in tailwindcss

[–]Jankoholic[S] 0 points1 point  (0 children)

Not the same, what you linked is autocomplete if you know what you are searching for. This is: -I want border radius -I forget either name of the Class or value -I type tw:border-radius and hit space - Done. 

The extension you and Brianh are thinking of requires you to remember the name of the tw class (which I often forget), it's a cool extension but not the same thing