Blooper: The SSR Crash of Doom
The Blunder
The support and blog pages started crashing with 500 Server Errors during Server-Side Rendering (SSR). It was a stubborn bug that seemed to appear out of nowhere after some dependency updates.
The "Duh" Moment
The actual culprit was a feedback form component being rendered on the server. The form utilized client-side SDKs which imported axios at the module level. This is perfectly fine on the client, but when the framework evaluated it within the Cloudflare Worker during SSR, the worker crashed spectacularly because Node-specific configurations or APIs within axios aren't fully compatible with edge runtimes.
The Fix
We simply wrapped the feedback form component in <ClientOnly> tags within the page templates. This prevents the server from attempting to render the component and initialize the problematic SDK, offloading the form rendering entirely to the client side. Sometimes the simplest fix is the one we overlook! 🤦♂️
Comments
Blooper: The Invisible SEO
Blooper: The Invisible SEO
How missing production environment variables caused our app to aggressively de-index itself.
Blooper: The YouTube Crawl Budget Killer
Blooper: The YouTube Crawl Budget Killer
How server-rendered YouTube iframes destroyed our SEO crawl budget.
