Why I Ditched GA4 for a Custom Next.js + Supabase Analytics Stack

Why I Ditched GA4 for a Custom Next.js + Supabase Analytics Stack

Let's be honest: GA4 is a nightmare for developers.

It's built for enterprise marketing teams. For those of us building micro-SaaS or lean startups, it feels like flying a Boeing 747 just to go to the grocery store. I spent more time debugging my tracking than building my product. So, I simplified everything.

The Problem: "Tracking Debt"

Most projects end up with a mess of scripts:

• 
  GA4 for traffic.


• 
  Clarity for heatmaps.


• 
  Stripe for the actual money.

Each script adds weight to your LCP and complicates your privacy policy. Worst of all: these tools don't talk to each other. You see a spike in traffic but have no idea if those users actually paid.

The Technical Stack

I wanted something fast, serverless-first, and scalable:

• 
  Frontend: Next.js (App Router)


• 
  Database: Supabase (PostgreSQL)


• 
  Backend: TypeScript


• 
  Infrastructure: Cloudflare

The Solution: Contextual Analytics

I built a custom dashboard to answer three questions in one place:

1. Technical Health vs. Revenue

One thing GA4 misses is the link between Core Web Vitals and Revenue. By measuring LCP and CLS directly within user sessions, I can see if a slow deployment actually cost me money in real-time.

2. The Stripe Link

Client-side event tracking often fails. By connecting directly to the Stripe API, I see the Real Lifetime Value (LTV) of a traffic source. If a Reddit post brings in 1,000 visitors but $0, and a niche newsletter brings in 10 visitors and 5 customers, I need to know that instantly.

3. The "Single Script" Philosophy

I replaced the bloat with one lightweight script. No manual event configuration for every button. It captures the interaction layer automatically for heatmaps and replays.

// Simple implementation

import { Analytics } from 'your-custom-tracker';



const Track = () => (

  <Analytics 

    projectId="your_id" 

    trackRevenue={true} 

    captureHeatmaps={true} 

  />

);

Conclusion

We've reached a point where analytics tools are more complex than the products we build. If you're feeling overwhelmed by GA4, you're not alone.

The real question isn't which tool has the most features — it's which tool actually answers your questions. For micro-SaaS, that usually means: who visited, did they pay, and did my latest deploy break anything? A custom stack built on Next.js and Supabase can answer all three in one place, without the overhead of stitching together five different dashboards.

What's your biggest pain point with modern analytics? Do you prefer specialized tools or a consolidated view?

More about this implementation: Zenovay Introduction