mirror of
https://github.com/Rohithgilla12/data-peek
synced 2026-04-21 21:07:17 +00:00
# Vercel Speed Insights Installation Successfully installed and configured Vercel Speed Insights for the data-peek webapp project. ## Changes Made ### 1. Package Installation - Added `@vercel/speed-insights` version ^2.0.0 to dependencies in `apps/webapp/package.json` - Updated `pnpm-lock.yaml` with the new dependency and its transitive dependencies ### 2. Component Integration - Modified `apps/webapp/src/app/layout.tsx`: - Imported `SpeedInsights` component from `@vercel/speed-insights/next` - Added `<SpeedInsights />` component inside the `<body>` tag, alongside the existing `<Analytics />` component ## Implementation Details The implementation follows the official Vercel Speed Insights quickstart documentation for Next.js App Router (v13.5+): - Used the correct Next.js-specific import path: `@vercel/speed-insights/next` - Placed the component in the root layout file at `app/layout.tsx` - Added the component inside the `<body>` tag as recommended ## Framework This project uses Next.js 16.0.7 with the App Router architecture, so the implementation uses the App Router-specific instructions from the official documentation. ## Next Steps To enable Speed Insights: 1. Deploy the application to Vercel 2. Navigate to the Vercel dashboard 3. Select Speed Insights from the sidebar 4. Choose the project and click Enable 5. After deployment, the Speed Insights script will be automatically injected at `/_vercel/speed-insights/*` 6. Once users visit the site, performance metrics will appear in the Vercel dashboard ## Notes - The existing `@vercel/analytics` package was already installed, so this addition complements the existing analytics setup - The pre-existing build errors in the codebase are unrelated to this change - they stem from missing dependencies in the shared `packages/ui` package - The SpeedInsights component is zero-bundle-size on the client and only loads the tracking script when needed Co-authored-by: Vercel <vercel[bot]@users.noreply.github.com> |
||
|---|---|---|
| .. | ||
| desktop | ||
| docs | ||
| video | ||
| web | ||
| webapp | ||