Founder pricing — only 4 of 50 seats left at $49/yrthen $149Claim yours

Integration Guide

How to Connect Next.js

Deploy cookieless, lightweight web analytics for your Next.js application in minutes.

Next.js is the premier framework for building high-performance, SEO-friendly React web applications. But adding default analytics libraries like Google Tag Manager can immediately bloat your bundle size, hurting your Core Web Vitals and search rankings.

TrackWhy is optimized for Next.js applications. With a script size of just 1.7 KB, it load-defers automatically and does not block the main thread. It enables you to measure pageviews, custom events, funnels, and retention without adding heavy runtime dependencies or loading trackers that affect performance.

Moreover, because TrackWhy is cookieless and collects no personally identifiable information (PII), you do not need to implement or display a cookie consent banner. Keep your user experience clean, fast, and fully compliant.

Start free trialNo credit card required.

Step-by-step

Setup guide in 5 simple steps.

  1. 1Log into your TrackWhy account and create a new site for your Next.js application.
  2. 2Copy the 1.7 KB tracker script tag.
  3. 3In Next.js App Router, place the script inside the root app layout.tsx using the next/script component with defer or lazyOnload strategies.
  4. 4Deploy your application. TrackWhy will automatically detect page changes on client-side navigation transitions.
  5. 5Define custom event triggers using trackwhy('eventName') to measure key click-actions.

Capabilities

What this integration unlocks.

Featherweight script footprint

At 1.7 KB, TrackWhy has zero impact on your PageSpeed or Lighthouse score, helping you rank higher.

Support for React / Server Components

Integrates perfectly with Next.js App Router, routing events correctly on client-side navigation transitions.

Opt-in Web Vitals tracking

Optionally monitor real-user Core Web Vitals (LCP, FID, CLS) directly within your Next.js application.

FAQ

Next.js + TrackWhy — FAQ.

Does TrackWhy support Next.js App Router and dynamic routing?
Yes. TrackWhy captures path transitions in single-page applications (SPAs) and App Router setups out of the box, without requiring manual router event listening.
Does TrackWhy impact my Next.js site performance?
No. Unlike Google Analytics which loads heavy scripts (gtag.js is ~50x larger), TrackWhy is a single 1.7 KB file that defers execution, ensuring it has zero impact on your core performance metrics.