From 14029d24500336ae7b1a5684e3ebe15e21590e55 Mon Sep 17 00:00:00 2001
From: "vercel[bot]" <35613825+vercel[bot]@users.noreply.github.com>
Date: Thu, 12 Feb 2026 17:41:49 -0600
Subject: [PATCH] Add Vercel Web Analytics to Next.js (#428)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
Implemented Vercel Web Analytics for Next.js (App Router)
## Summary
Successfully installed and configured @vercel/analytics package for the Next.js documentation site.
## Changes Made
### 1. Installed Dependencies
- Installed `@vercel/analytics` package using pnpm
- Command executed: `pnpm install @vercel/analytics`
### 2. Modified Files
- **docs/src/app/layout.tsx**
- Added import: `import { Analytics } from "@vercel/analytics/next";`
- Added `` component inside the `` tag, right after ``
- Placement follows best practices for App Router projects
### 3. Updated Lock Files
- **docs/package.json** - Added @vercel/analytics to dependencies
- **docs/pnpm-lock.yaml** - Updated with new dependency tree
## Implementation Details
- This is an App Router project (uses `app/` directory structure)
- The Analytics component was added to the root layout file at `docs/src/app/layout.tsx`
- Followed the same pattern as the existing SpeedInsights component
- Preserved all existing code structure and formatting
## Verification
✅ Build completed successfully with no errors
✅ TypeScript compilation passed
✅ Modified file passes ESLint checks
✅ All 15 static pages generated correctly
## Notes
- The project already had @vercel/speed-insights installed, so the pattern for adding Analytics was consistent
- Pre-existing lint errors in mobile-nav-context.tsx and theme-toggle.tsx are unrelated to this change
- Lock files are properly updated and staged as per dependency changes
Co-authored-by: Vercel
---
docs/package.json | 1 +
docs/pnpm-lock.yaml | 34 ++++++++++++++++++++++++++++++++++
docs/src/app/layout.tsx | 2 ++
3 files changed, 37 insertions(+)
diff --git a/docs/package.json b/docs/package.json
index 983b252..077a183 100644
--- a/docs/package.json
+++ b/docs/package.json
@@ -17,6 +17,7 @@
"@streamdown/code": "^1.0.2",
"@upstash/ratelimit": "^2.0.8",
"@upstash/redis": "^1.36.2",
+ "@vercel/analytics": "^1.6.1",
"@vercel/speed-insights": "^1.3.1",
"ai": "^6.0.78",
"bash-tool": "^1.3.14",
diff --git a/docs/pnpm-lock.yaml b/docs/pnpm-lock.yaml
index 765b5c8..f5db3f9 100644
--- a/docs/pnpm-lock.yaml
+++ b/docs/pnpm-lock.yaml
@@ -32,6 +32,9 @@ importers:
'@upstash/redis':
specifier: ^1.36.2
version: 1.36.2
+ '@vercel/analytics':
+ specifier: ^1.6.1
+ version: 1.6.1(next@16.1.1(@babel/core@7.28.6)(@opentelemetry/api@1.9.0)(react-dom@19.2.3(react@19.2.3))(react@19.2.3))(react@19.2.3)
'@vercel/speed-insights':
specifier: ^1.3.1
version: 1.3.1(next@16.1.1(@babel/core@7.28.6)(@opentelemetry/api@1.9.0)(react-dom@19.2.3(react@19.2.3))(react@19.2.3))(react@19.2.3)
@@ -1620,6 +1623,32 @@ packages:
'@upstash/redis@1.36.2':
resolution: {integrity: sha512-C0Yt8hc12vLaQYRG1fMci8iPrLtnTdbJG0HR5T8vKnvEP/1RdMMblsOJs5/jp0JXZJ1oSzMnQz4J9EVezNpI6A==}
+ '@vercel/analytics@1.6.1':
+ resolution: {integrity: sha512-oH9He/bEM+6oKlv3chWuOOcp8Y6fo6/PSro8hEkgCW3pu9/OiCXiUpRUogDh3Fs3LH2sosDrx8CxeOLBEE+afg==}
+ peerDependencies:
+ '@remix-run/react': ^2
+ '@sveltejs/kit': ^1 || ^2
+ next: '>= 13'
+ react: ^18 || ^19 || ^19.0.0-rc
+ svelte: '>= 4'
+ vue: ^3
+ vue-router: ^4
+ peerDependenciesMeta:
+ '@remix-run/react':
+ optional: true
+ '@sveltejs/kit':
+ optional: true
+ next:
+ optional: true
+ react:
+ optional: true
+ svelte:
+ optional: true
+ vue:
+ optional: true
+ vue-router:
+ optional: true
+
'@vercel/oidc@3.1.0':
resolution: {integrity: sha512-Fw28YZpRnA3cAHHDlkt7xQHiJ0fcL+NRcIqsocZQUSmbzeIKRpwttJjik5ZGanXP+vlA4SbTg+AbA3bP363l+w==}
engines: {node: '>= 20'}
@@ -5249,6 +5278,11 @@ snapshots:
dependencies:
uncrypto: 0.1.3
+ '@vercel/analytics@1.6.1(next@16.1.1(@babel/core@7.28.6)(@opentelemetry/api@1.9.0)(react-dom@19.2.3(react@19.2.3))(react@19.2.3))(react@19.2.3)':
+ optionalDependencies:
+ next: 16.1.1(@babel/core@7.28.6)(@opentelemetry/api@1.9.0)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)
+ react: 19.2.3
+
'@vercel/oidc@3.1.0': {}
'@vercel/speed-insights@1.3.1(next@16.1.1(@babel/core@7.28.6)(@opentelemetry/api@1.9.0)(react-dom@19.2.3(react@19.2.3))(react@19.2.3))(react@19.2.3)':
diff --git a/docs/src/app/layout.tsx b/docs/src/app/layout.tsx
index 75f48d9..4d451a4 100644
--- a/docs/src/app/layout.tsx
+++ b/docs/src/app/layout.tsx
@@ -8,6 +8,7 @@ import { Sidebar } from "@/components/sidebar";
import { DocsChat } from "@/components/docs-chat";
import { cookies } from "next/headers";
import { SpeedInsights } from "@vercel/speed-insights/next";
+import { Analytics } from "@vercel/analytics/next";
const geist = Geist({
variable: "--font-geist",
@@ -64,6 +65,7 @@ export default async function RootLayout({
+