Does this track Next.js route transitions with useParams or searchParams?

Yes! Any URL change triggered by next/link or useRouter().push() is automatically recorded.

Sufyaan Studio Engineering•3 min read

How to Track Next.js App Router Pageviews Without Cookies

A step-by-step developer tutorial for tracking Next.js 14/15 App Router applications without cookies or consent banners.

Direct Tutorial Summary

By Sufyaan Studio Engineering•Verified August 2026

To track Next.js App Router pageviews without cookies, add the 1.15 KB Analytics script to your root app/layout.tsx using next/script with strategy="afterInteractive". The script automatically hooks into history.pushState and history.replaceState to track client-side route changes seamlessly.

KEY TAKEAWAYS

Step 1: Obtain your Website UUID
Step 2: Add Script to app/layout.tsx
Step 3: Verify Route Navigation in DevTools

Step 1: Obtain your Website UUID

Step 2: Add Script to app/layout.tsx

Import the Script component from next/script and insert the lightweight tracking script into the <head> of your root layout.

CODE STEP 2

// app/layout.tsx
import Script from 'next/script';

export default function RootLayout({ children }: { children: React.ReactNode }) {
  return (
    <html lang="en">
      <head>
        <Script
          defer
          src="https://analytics.sufyaanstudio.com/t.js"
          data-web="YOUR_WEBSITE_ID"
          strategy="afterInteractive"
        />
      </head>
      <body>{children}</body>
    </html>
  );
}

Step 3: Verify Route Navigation in DevTools

Open your browser Developer Tools (F12) -> Network tab, filter by /c, and navigate between pages in your Next.js application. You will see instant 204 No Content beacon responses for each client route change.

FAQ & VERIFICATION

Guide FAQ

Start tracking your websites with confidence.

Create an account in 30 seconds. Up to 25,000 events free every month.

EXPLORE MORE COMPARISONS & ALTERNATIVES

VS Google Analytics 4 (GA4)

FREE DEVELOPER TOOLS

How to Track Next.js App Router Pageviews Without Cookies

Step 1: Obtain your Website UUID

Step 2: Add Script to app/layout.tsx

Step 3: Verify Route Navigation in DevTools

Guide FAQ

Start tracking your websites with confidence.

Google Analytics 4 (GA4)

Plausible Analytics

Fathom Analytics

Umami Analytics