I pre-rendered my landing page for SEO. Google saw 1,889 words of invisible text.

I build LeadReddit solo. Nine days ago I shipped a fix I was proud of: the landing page is a React SPA, so crawlers were getting an empty shell. I added a build-time pre-render that injects the real landing HTML into index.html. 86 words became 1,889.

Today a directory published a screenshot of my landing page on its listing. The screenshot was blank.

That is how I found it. The landing uses a scroll-reveal component: elements start at opacity-0 and fade in when they enter the viewport. The pre-render runs in Node, where useEffect never fires. So the static HTML shipped frozen in the pre-animation state. 40 blocks of opacity-0, zero opacity-100, h1 included.

In a browser you never notice, because a 1.2s fallback reveals everything. But anything reading the HTML without executing JS — directories, thumbnail generators, and Google's first pass — got 1,889 words of invisible text on the most important page of the domain. That is not a missed opportunity, it is a spam pattern.

The fix was one line: useState(false) became useState(typeof window === 'undefined'). During the pre-render there is no window, so the HTML ships visible; in the browser it starts hidden and animates exactly as before.

Two things I am taking from it. A green build and passing tests said nothing here — the bug only existed in the artifact nobody looks at, the raw HTML. And the person who found it was not me, it was a screenshot on someone else's site.

If you pre-render a React page: curl it and grep for opacity-0. Takes ten seconds.