Install on Vercel (sites that aren't Next.js)

For sites on Vercel built without Next.js: static HTML, Vite, Astro and similar. One file runs as Vercel Routing Middleware in front of your pages and, for each page load, sends a privacy-reduced event to Punchline Analytics after the response has gone out. Next.js sites use the Next.js package instead.

• Nothing changes for your visitors. No cookies, and pages pass through untouched.
• It sees what Google Analytics can't: crawlers, AI fetchers and coding agents that never run JavaScript.
• Never breaks your site. Without a DSN, or if Punchline is unreachable, requests continue normally.
• Works with the browser snippet. If you also use the snippet, each page load is counted once.

Install

You'll need your PUNCHLINE_DSN value (we send it when your site is set up).

1. Add the file. Download punchline-vercel-middleware.ts and save it at the root of your project as middleware.ts (next to index.html or package.json). It has no dependencies.
2. Add your DSN. In Vercel, open the project's Settings → Environment Variables and add PUNCHLINE_DSN for Production.
3. Deploy. Push to your repository as usual. In the deployment's details, Functions now lists middleware.
4. Check it's working. Visit a few pages. They appear in your Punchline dashboard within about a minute.

Why .ts? Vercel compiles a TypeScript middleware file itself, so it works whatever your project's module settings are. A middleware.js would need "type": "module" in package.json, which can break existing serverless functions written with module.exports, and middleware.mjs isn't picked up.

What runs, and what doesn't

The middleware runs on pages and on the text files agents fetch (robots.txt, llms.txt, sitemap.xml). It skips /api/ routes and assets (images, scripts, styles, fonts, video, PDFs), so they cost nothing extra. Vercel bills Routing Middleware as fluid compute.

What's sent is the same as the other installs: the host, the path and utm_* values (every other query parameter is removed), the referrer's host, the Accept header, and, in memory only, the IP address and user agent, which the collector uses for classification and a daily visitor code and then discards.

Serving AI agents markdown isn't available in this install yet; use the Next.js package or the Cloudflare Worker for that.