We just hit a major architectural milestone at GameHzLab! 🚀
After weeks of refactoring, we have successfully migrated our project's backend from a "Loopback-heavy" architecture to a Direct Service Layer pattern. If you’ve ever struggled with your own WAF blocking your server-side requests, this one is for you.
🛑 The Problem: The "403 Forbidden" Wall
Previously, our Server Components (Home, Category, and Detail pages) on GameHzLab fetched data by making internal HTTP requests to our own API routes. While this felt "modular," it introduced a critical point of failure: Cloudflare WAF.
Our server's internal requests were occasionally flagged as suspicious by our own firewall, leading to intermittent 403 errors and broken page renders.
🛠️ The Solution: gameService.ts
We introduced a unified gameService.ts to act as our data "Source of Truth."
Direct Database Access: Server components now call the service layer directly to fetch data from Supabase.
Bypassing the WAF: Since these are internal function calls rather than outbound HTTP requests, we have completely eliminated the risk of being blocked by our own security layers.
Architecture Standardization: All API routes have been refactored into lightweight wrappers around gameService, making the codebase cleaner and significantly easier to maintain.
📈 The Results
- Major Performance Boost (TTFB) By cutting out the overhead of the internal network stack (DNS lookup, TCP handshake, and TLS negotiation for every internal request), we’ve slashed our Time to First Byte (TTFB).
Estimated Impact: We expect a 100-200ms reduction in page rendering latency across the platform.
- GA4 Data Purity 🛡️ Analytics are only useful if they are accurate. We noticed that server-side crawlers were inflating our numbers.
We’ve implemented a server-side bot detection logic in layout.tsx. Now, when known crawlers visit GameHzLab, the GA4 script is no longer loaded. This protects our analysis from "noise" and ensures our data reflects real human engagement.
💡 Key Takeaway
If you are building with Next.js or any modern SSR framework, avoid the temptation to "fetch your own API" from within Server Components. It adds latency, introduces security hurdles, and complicates your architecture. Go direct.
Check out the live results at: www.gamehzlab.com
Have you faced issues with WAFs blocking your own server-side requests? Let’s discuss in the comments!
Top comments (0)