•4 min read

Privacy-Friendly Analytics That Actually Work (Even With Adblockers)

How to implement Umami analytics with Next.js rewrites to bypass adblockers while respecting user privacy.

analyticsprivacynext.jsweb-performance

If you run a website in 2026, you've probably noticed: your analytics are lying to you.

Not because they're broken, but because 40-60% of your visitors are blocking them. uBlock Origin, Brave Browser, Pi-hole - privacy tools are everywhere, and they're getting smarter.

The irony? Most developers who care about privacy (like me) end up with blind spots in their own traffic data. We switched from Google Analytics to privacy-friendly alternatives like Umami or Plausible, but adblockers don't care. They block everything that looks like tracking.

Here's how I solved it without compromising on privacy.

The Problem: Third-Party Domains Are Dead

Traditional analytics work like this:

  1. Load a script from analytics-provider.com
  2. Send data to analytics-provider.com/api/collect
  3. Hope the user's browser allows it

Adblockers maintain massive blocklists of known tracking domains. When they see a request to umami.is, plausible.io, or google-analytics.com, they kill it instantly.

Even privacy-respecting tools get caught in the crossfire.

The Solution: First-Party Proxying

Instead of loading analytics from a third-party domain, we proxy it through our own. From the browser's perspective, all requests stay on yourdomain.com.

The trick: Next.js rewrites.

Step 1: Configure Server-Side Rewrites

In next.config.ts:

async rewrites() {
  return [
    {
      source: "/metrics/lib.js",
      destination: "https://cloud.umami.is/script.js",
    },
    {
      source: "/metrics/api/send",
      destination: "https://cloud.umami.is/api/send",
    },
  ];
}

What this does:

  • Browser requests /metrics/lib.js, Next.js fetches it from Umami's CDN server-side
  • Tracking data sent to /metrics/api/send gets forwarded to Umami's API
  • The browser never touches umami.is directly

Everything looks like first-party traffic.

Step 2: Load the Script from Your Domain

In app/layout.tsx:

<Script
  src="/metrics/lib.js"
  data-website-id="your-umami-website-id"
  data-host-url="/metrics"
  strategy="lazyOnload"
/>

Key details:

  • src="/metrics/lib.js" loads from your domain, not Umami's
  • data-host-url="/metrics" tells the script to send data to /metrics/api/send
  • strategy="lazyOnload" defers loading until after the page is interactive

Performance win.

Step 3: Deploy and Test

  1. Open your site with an adblocker enabled
  2. Check DevTools, Network tab
  3. You should see:
    • metrics/lib.js loads (200 status)
    • metrics/api/send receives POST requests
    • No requests to umami.is (all proxied)

If you see those three things, you're done.

Why This Works (And Why It's Not Evil)

Adblockers use domain-based filtering. They can't block /metrics/lib.js on your domain because:

  1. It's not on any blocklist
  2. It's a same-origin request (no third-party warning)
  3. They'd have to block your entire site to stop it

But isn't this sneaky?

Here's the thing: Umami doesn't track individuals. It doesn't use cookies, doesn't collect personal data, doesn't sell anything to advertisers, and is fully GDPR compliant.

You're not bypassing adblockers to enable invasive tracking. You're bypassing them to get accurate visitor counts and page views. Metrics that help you understand what content resonates.

If you were proxying Google Analytics with cross-site tracking, yeah, that'd be sketchy. But privacy-friendly analytics? Different story.

The Performance Bonus

Beyond avoiding blockers, this approach has a hidden benefit: faster page loads.

When you load a script from a third-party domain, the browser has to:

  1. DNS lookup for the external domain
  2. Establish a new connection
  3. Negotiate TLS
  4. Download the script

With first-party proxying:

  1. Same domain (no DNS lookup)
  2. Existing connection (HTTP/2 multiplexing)
  3. Already-established TLS session

The script loads faster, and you get better Core Web Vitals.

Other Frameworks?

This technique works anywhere you can configure server-side rewrites:

  • Vercel: Use vercel.json rewrites
  • Netlify: Use _redirects or netlify.toml
  • Cloudflare Workers: Intercept and proxy requests
  • Nginx/Apache: Configure reverse proxy rules

The concept is the same: make third-party analytics look like first-party requests.

The Reality

Privacy and analytics don't have to be enemies.

The web is moving toward a world where users demand privacy (and tools to enforce it), developers need data to build better products, and cookie banners are dying (good riddance).

First-party proxying with privacy-friendly tools is the middle ground. You get the insights you need without compromising user trust.

When 50% of your visitors are blocking analytics, you're not making informed decisions. You're guessing.

Try It Yourself

If you're using Next.js and want to add Umami:

  1. Sign up at umami.is (free tier is generous)
  2. Add the rewrites to next.config.ts
  3. Add the script tag to your layout
  4. Deploy and watch your real traffic numbers come in

No more blind spots. No more guessing.

Just privacy-friendly analytics that actually work.