Free analytics for Next.js sites and route handlers

Add pageview tracking

Add your domain, then put the tracking script from your site settings in app/layout.tsx. Pageviews need no npm package.

export default function RootLayout({
  children,
}: {
  children: React.ReactNode;
}) {
  return (
    <html lang="en">
      <body>
        {children}
        <script
          async
          src="https://clicktag.io/latest.js"
          data-hostname="example.com"
          data-verify="YOUR_SITE_VERIFY_TOKEN"
        />
      </body>
    </html>
  );
}

The script hooks history.pushState and listens to popstate, so client-side navigation in the App Router records pageviews on its own. The first pageview verifies your site.

Track events

Call window.tt_event("signup") from a client component, or send events from a route handler or server action with POST /events. Events power goals and 2 to 6 step funnels with median and p90 time to convert. See custom events.

Monitor route handlers

npm install totallytics

// app/users/[id]/route.ts
import { withTotallytics } from "totallytics/next";

async function getUser(
  request: Request,
  { params }: { params: Promise<{ id: string }> },
) {
  const { id } = await params;
  return Response.json({ id });
}

export const GET = withTotallytics(getUser);

withTotallytics works on Next.js 14.2 and newer, in the Node.js or edge runtime. Routes are rebuilt from params, so /users/42 shows up as /users/:id, with requests, status codes, p50, p95 and p99 latency, errors and callers. On Next.js 15.1 and newer, batches go out after the response with after(). Set TOTALLYTICS_API_KEY in your environment.

Clicktag vs Vercel Web Analytics

Vercel details checked on September 30, 2026 in Vercel's documentation.

Vercel Web Analytics is the simpler pick if you only deploy on Vercel and want your numbers inside the Vercel dashboard.

FAQ

Does withTotallytics slow down responses?

No. It records metrics in memory and sends them in the background, and it never delays a response.

What does the middleware send?

The route template, method, status code, duration, user agent and an optional consumer id. It never sends request or response bodies, query strings, IP addresses or other headers.

Where is the data stored?

In Frankfurt, Germany, collected on Cloudflare's network.