From aa218ba95df7f44d14db7a9439a5871bee4c5fca Mon Sep 17 00:00:00 2001 From: Vercel Date: Sat, 25 Apr 2026 10:22:11 +0000 Subject: [PATCH] Install Vercel Web Analytics ## Vercel Web Analytics Installation Complete Successfully installed and configured Vercel Web Analytics for this project following the latest official documentation from https://vercel.com/docs/analytics/quickstart. ### Changes Made **1. Installed Package:** - Added `@vercel/analytics` v2.0.1 to package.json dependencies - Updated package-lock.json with the new dependency **2. Configured Analytics in app.js:** - Imported the `inject` function from `@vercel/analytics` via CDN (https://esm.sh/@vercel/analytics@1.4.1) - Added `inject()` call to initialize Web Analytics, following the same pattern as the existing Speed Insights integration - Placed the initialization right after Speed Insights initialization for consistency ### Implementation Details The project is a vanilla JavaScript/HTML application that uses ES modules. I followed the programmatic injection approach to match the existing Speed Insights implementation: - **Before:** Only Speed Insights was active via `injectSpeedInsights()` - **After:** Both Speed Insights and Web Analytics are active via their respective inject functions The existing `window.va` stub in index.html (lines 12-14) was left unchanged as it's compatible with the programmatic injection approach. ### Framework Detection This is a vanilla JavaScript project (not React, Next.js, Vue, etc.) so I used: - CDN imports via esm.sh for both Speed Insights and Web Analytics - Programmatic `inject()` function rather than framework-specific components ### Testing - Verified JavaScript syntax is valid with `node --check app.js` - No build step required for this static site - No linter configured in the project ### Next Steps After deployment to Vercel: 1. Enable Web Analytics in the Vercel dashboard under Analytics 2. Verify the integration by checking the browser Network tab for requests to analytics endpoints 3. View analytics data in the Vercel dashboard All changes preserve the existing code structure and only add the necessary Web Analytics integration. Co-authored-by: Vercel --- app.js | 4 ++++ package-lock.json | 47 +++++++++++++++++++++++++++++++++++++++++++++-- package.json | 1 + 3 files changed, 50 insertions(+), 2 deletions(-) diff --git a/app.js b/app.js index 5fa3694..5a44b7f 100644 --- a/app.js +++ b/app.js @@ -2,12 +2,16 @@ import * as ort from 'https://cdn.jsdelivr.net/npm/onnxruntime-web@1.20.1/dist/o import { initGis } from './gis.js'; import { initPaint } from './paint.js'; import { injectSpeedInsights } from 'https://esm.sh/@vercel/speed-insights@2.0.0'; +import { inject } from 'https://esm.sh/@vercel/analytics@1.4.1'; ort.env.wasm.wasmPaths = 'https://cdn.jsdelivr.net/npm/onnxruntime-web@1.20.1/dist/'; // Initialize Vercel Speed Insights injectSpeedInsights(); +// Initialize Vercel Web Analytics +inject(); + // ── DOM refs ───────────────────────────────────────────────────────────────── const dropZone = document.getElementById('dropZone'); const fileInput = document.getElementById('fileInput'); diff --git a/package-lock.json b/package-lock.json index 25ccbcd..3e85ca7 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,17 +1,60 @@ { - "name": "primary", + "name": "ofmap-gen", "version": "1.0.0", "lockfileVersion": 3, "requires": true, "packages": { "": { - "name": "primary", + "name": "ofmap-gen", "version": "1.0.0", "license": "ISC", "dependencies": { + "@vercel/analytics": "^2.0.1", "@vercel/speed-insights": "^2.0.0" } }, + "node_modules/@vercel/analytics": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/@vercel/analytics/-/analytics-2.0.1.tgz", + "integrity": "sha512-MTQG6V9qQrt1tsDeF+2Uoo5aPjqbVPys1xvnIftXSJYG2SrwXRHnqEvVoYID7BTruDz4lCd2Z7rM1BdkUehk2g==", + "license": "MIT", + "peerDependencies": { + "@remix-run/react": "^2", + "@sveltejs/kit": "^1 || ^2", + "next": ">= 13", + "nuxt": ">= 3", + "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 + }, + "nuxt": { + "optional": true + }, + "react": { + "optional": true + }, + "svelte": { + "optional": true + }, + "vue": { + "optional": true + }, + "vue-router": { + "optional": true + } + } + }, "node_modules/@vercel/speed-insights": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/@vercel/speed-insights/-/speed-insights-2.0.0.tgz", diff --git a/package.json b/package.json index d5f3ea4..27ace8f 100644 --- a/package.json +++ b/package.json @@ -20,6 +20,7 @@ }, "homepage": "https://github.com/baculinivan-web/OFmapGen#readme", "dependencies": { + "@vercel/analytics": "^2.0.1", "@vercel/speed-insights": "^2.0.0" } }