When I launched my project, DeploySnap, I made a mistake a lot of developers make:
I built the marketing site using a standard React SPA setup.
Everything looked fine visually, but there was one huge problem:
Search engines were basically seeing this:
<div id="root"></div>
That meant:
- slow indexing
- poor SEO performance
- weak social previews
- bad first contentful paint
- almost zero organic discoverability And for a SaaS product, that’s brutal because your website is often your biggest acquisition channel.
The original setup
I was using:
- React
- Vite
- React Router
- react-helmet
Pretty normal frontend stack.
The issue was that all content was rendered client-side.
Even though I had proper routes like:
- /features
- /pricing
- /docs
Google still had to wait for JavaScript execution to understand the page content.
That’s not ideal.
Why I didn’t move to Next.js
A lot of people would immediately suggest:
“Just migrate to Next.js”
But that felt unnecessary.
My product itself is a static hosting platform, so moving to full SSR felt ironic and overcomplicated.
I wanted:
- static hosting compatibility
- fast page loads
- proper SEO
- minimal framework rewrite
- My solution: custom static site generation
I kept React + Vite and built a custom pre-render system.
During build:
- React routes are rendered using renderToString()
- Each route generates its own HTML file
- Meta tags are injected during build
- Sitemap gets generated automatically
- robots.txt gets generated automatically
Example output:
/dist
index.html
features/index.html
pricing/index.html
tools/html-minifier/index.html
Now search engines receive fully rendered HTML instantly.
SEO improvements I added
1. Static HTML rendering
No more empty root div.
2. Dynamic meta tags
Every page now has:
- title
- meta description
- OpenGraph tags
- canonical tags
3. Structured data
Added JSON-LD for:
- SoftwareApplication
- FAQ pages
- blog pages
4. Automated sitemap generation
/sitemap.xml
5. robots.txt generation
/robots.txt
Biggest lesson
Building a product is only half the battle.
If nobody can discover it through search, distribution becomes much harder.
Technical SEO was something I ignored early, but fixing it completely changed how I think about product launches.
What I’m building
DeploySnap is a simple static hosting platform where you can upload your build files and deploy quickly.
Still early stage and learning a lot.
Would love feedback from developers who’ve faced similar SEO issues with React apps.
Have you solved this differently?
Top comments (0)