Install Vercel Speed Insights for Next.js

## Vercel Speed Insights Integration

Successfully implemented Vercel Speed Insights for the json-render project.

### Changes Made

#### 1. Installation
- Installed `@vercel/speed-insights@^1.3.1` using pnpm package manager
- Updated `apps/web/package.json` with the new dependency
- Updated `pnpm-lock.yaml` to reflect the new dependency

#### 2. Configuration
- **File Modified**: `apps/web/app/layout.tsx`
- Added import: `import { SpeedInsights } from "@vercel/speed-insights/next"`
- Added component: `<SpeedInsights />` in the body tag after the `<Analytics />` component
- This follows Next.js 13.5+ with App Router best practices

### Implementation Details

The project uses:
- **Next.js version**: 16.1.1 (with App Router)
- **Package manager**: pnpm (v9.0.0)
- **Router type**: App Router (`app/` directory)

Since the project uses Next.js 16.1.1 with App Router, the implementation uses:
- `@vercel/speed-insights/next` import (for Next.js 13.5+)
- Direct component placement in the root layout (no 'use client' directive needed)
- Positioned after the Analytics component in the body tag

### Testing

✓ Build completed successfully (all 4 workspace projects compiled)
✓ ESLint passed with no warnings or errors
✓ No TypeScript errors or type conflicts
✓ All dependencies properly installed

### Files Changed

1. `apps/web/package.json` - Added @vercel/speed-insights dependency
2. `apps/web/app/layout.tsx` - Added SpeedInsights component and import
3. `pnpm-lock.yaml` - Updated lock file with new dependency

The implementation is minimal, non-breaking, and follows the existing project patterns (similar to how @vercel/analytics is already integrated).

Co-authored-by: Vercel <vercel[bot]@users.noreply.github.com>

apps/web/app/layout.tsx

@@ -5,6 +5,7 @@ import { Header } from "@/components/header";
 import { Footer } from "@/components/footer";
 import { ThemeProvider } from "@/components/theme-provider";
 import { Analytics } from "@vercel/analytics/next";
+import { SpeedInsights } from "@vercel/speed-insights/next";
 
 const geistSans = localFont({
   src: "./fonts/GeistVF.woff",
@@ -37,6 +38,7 @@ export default function RootLayout({
           </div>
         </ThemeProvider>
         <Analytics />
+        <SpeedInsights />
       </body>
     </html>
   );

apps/web/package.json

@@ -18,6 +18,7 @@
     "@radix-ui/react-slot": "^1.2.4",
     "@radix-ui/react-tabs": "^1.1.13",
     "@vercel/analytics": "^1.6.1",
+    "@vercel/speed-insights": "^1.3.1",
     "ai": "^6.0.33",
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",

pnpm-lock.yaml

@@ -44,6 +44,9 @@ importers:
       '@vercel/analytics':
         specifier: ^1.6.1
         version: 1.6.1(next@16.1.1(@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(@opentelemetry/api@1.9.0)(react-dom@19.2.3(react@19.2.3))(react@19.2.3))(react@19.2.3)
       ai:
         specifier: ^6.0.33
         version: 6.0.33(zod@3.25.76)
@@ -1236,6 +1239,29 @@ packages:
     resolution: {integrity: sha512-Fw28YZpRnA3cAHHDlkt7xQHiJ0fcL+NRcIqsocZQUSmbzeIKRpwttJjik5ZGanXP+vlA4SbTg+AbA3bP363l+w==}
     engines: {node: '>= 20'}
 
+  '@vercel/speed-insights@1.3.1':
+    resolution: {integrity: sha512-PbEr7FrMkUrGYvlcLHGkXdCkxnylCWePx7lPxxq36DNdfo9mcUjLOmqOyPDHAOgnfqgGGdmE3XI9L/4+5fr+vQ==}
+    peerDependencies:
+      '@sveltejs/kit': ^1 || ^2
+      next: '>= 13'
+      react: ^18 || ^19 || ^19.0.0-rc
+      svelte: '>= 4'
+      vue: ^3
+      vue-router: ^4
+    peerDependenciesMeta:
+      '@sveltejs/kit':
+        optional: true
+      next:
+        optional: true
+      react:
+        optional: true
+      svelte:
+        optional: true
+      vue:
+        optional: true
+      vue-router:
+        optional: true
+
   acorn-jsx@5.3.2:
     resolution: {integrity: sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==}
     peerDependencies:
@@ -3495,6 +3521,11 @@ snapshots:
 
   '@vercel/oidc@3.1.0': {}
 
+  '@vercel/speed-insights@1.3.1(next@16.1.1(@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(@opentelemetry/api@1.9.0)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)
+      react: 19.2.3
+
   acorn-jsx@5.3.2(acorn@8.15.0):
     dependencies:
       acorn: 8.15.0