From 7dfdc4e55cbbaaf042adfe7aa4a84ad5c3f32005 Mon Sep 17 00:00:00 2001 From: Vercel Date: Sat, 5 Sep 2026 02:30:49 +0000 Subject: [PATCH] Install Vercel Speed Insights with docs MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit ## Vercel Speed Insights Installation Successfully installed and configured Vercel Speed Insights for the ZenkaiTV anime streaming application. ### Changes Made **1. Package Installation** - Added `@vercel/speed-insights` v2.0.0 as a dependency - Updated `package.json` and `package-lock.json` with the new package **2. Integration into HTML Files** Modified both HTML entry points to include the Speed Insights initialization: - `index.html` - Main web application entry point - `android/app/src/main/assets/index.html` - Android TV app entry point Added the following script before the closing `` tag in both files: ```html ``` ### Implementation Details **Framework Detection:** This project uses vanilla JavaScript/HTML (not a framework like Next.js or React), so I followed the Vercel documentation's HTML/Astro approach using the `injectSpeedInsights()` function. **Why This Approach:** - The project is a static HTML application with vanilla JavaScript - Used ES module import to load the Speed Insights library - The `injectSpeedInsights()` function automatically handles script injection and initialization - This approach is compatible with the project's existing architecture **Files Updated:** 1. `package.json` - Added @vercel/speed-insights dependency 2. `package-lock.json` - Updated with new package and its dependencies 3. `index.html` - Added Speed Insights script 4. `android/app/src/main/assets/index.html` - Added Speed Insights script (to maintain mirror sync) ### Verification ✅ All checks passed: - `npm run check` - All syntax checks passed - `npm test` - All 16 tests passed - `npm run vercel-build` - Build completed successfully - Asset version consistency verified - Android mirror sync verified - No global collisions detected - Security audit passed ### Next Steps After deployment to Vercel: 1. The Speed Insights script will automatically start collecting performance metrics 2. Data will appear in the Vercel dashboard under the Speed Insights section 3. Metrics typically begin showing within a few days after users visit the site 4. You can configure sampling rates and access advanced features in the Vercel dashboard The integration is now complete and ready for deployment! Co-authored-by: Vercel --- android/app/src/main/assets/index.html | 5 ++ index.html | 5 ++ package-lock.json | 87 ++++++++++++-------------- package.json | 1 + 4 files changed, 50 insertions(+), 48 deletions(-) diff --git a/android/app/src/main/assets/index.html b/android/app/src/main/assets/index.html index 01bdc97..b50cc1b 100644 --- a/android/app/src/main/assets/index.html +++ b/android/app/src/main/assets/index.html @@ -82,6 +82,11 @@ + + diff --git a/index.html b/index.html index 01bdc97..b50cc1b 100644 --- a/index.html +++ b/index.html @@ -82,6 +82,11 @@ + + diff --git a/package-lock.json b/package-lock.json index 9e4c209..042a969 100644 --- a/package-lock.json +++ b/package-lock.json @@ -11,6 +11,7 @@ "dependencies": { "@supabase/ssr": "^0.12.0", "@supabase/supabase-js": "^2.108.1", + "@vercel/speed-insights": "^2.0.0", "hls.js": "^1.6.16", "sharp": "0.35.2" }, @@ -143,9 +144,6 @@ "cpu": [ "arm" ], - "libc": [ - "glibc" - ], "license": "LGPL-3.0-or-later", "optional": true, "os": [ @@ -162,9 +160,6 @@ "cpu": [ "arm64" ], - "libc": [ - "glibc" - ], "license": "LGPL-3.0-or-later", "optional": true, "os": [ @@ -181,9 +176,6 @@ "cpu": [ "ppc64" ], - "libc": [ - "glibc" - ], "license": "LGPL-3.0-or-later", "optional": true, "os": [ @@ -200,9 +192,6 @@ "cpu": [ "riscv64" ], - "libc": [ - "glibc" - ], "license": "LGPL-3.0-or-later", "optional": true, "os": [ @@ -219,9 +208,6 @@ "cpu": [ "s390x" ], - "libc": [ - "glibc" - ], "license": "LGPL-3.0-or-later", "optional": true, "os": [ @@ -238,9 +224,6 @@ "cpu": [ "x64" ], - "libc": [ - "glibc" - ], "license": "LGPL-3.0-or-later", "optional": true, "os": [ @@ -257,9 +240,6 @@ "cpu": [ "arm64" ], - "libc": [ - "musl" - ], "license": "LGPL-3.0-or-later", "optional": true, "os": [ @@ -276,9 +256,6 @@ "cpu": [ "x64" ], - "libc": [ - "musl" - ], "license": "LGPL-3.0-or-later", "optional": true, "os": [ @@ -295,9 +272,6 @@ "cpu": [ "arm" ], - "libc": [ - "glibc" - ], "license": "Apache-2.0", "optional": true, "os": [ @@ -320,9 +294,6 @@ "cpu": [ "arm64" ], - "libc": [ - "glibc" - ], "license": "Apache-2.0", "optional": true, "os": [ @@ -345,9 +316,6 @@ "cpu": [ "ppc64" ], - "libc": [ - "glibc" - ], "license": "Apache-2.0", "optional": true, "os": [ @@ -370,9 +338,6 @@ "cpu": [ "riscv64" ], - "libc": [ - "glibc" - ], "license": "Apache-2.0", "optional": true, "os": [ @@ -395,9 +360,6 @@ "cpu": [ "s390x" ], - "libc": [ - "glibc" - ], "license": "Apache-2.0", "optional": true, "os": [ @@ -420,9 +382,6 @@ "cpu": [ "x64" ], - "libc": [ - "glibc" - ], "license": "Apache-2.0", "optional": true, "os": [ @@ -445,9 +404,6 @@ "cpu": [ "arm64" ], - "libc": [ - "musl" - ], "license": "Apache-2.0", "optional": true, "os": [ @@ -470,9 +426,6 @@ "cpu": [ "x64" ], - "libc": [ - "musl" - ], "license": "Apache-2.0", "optional": true, "os": [ @@ -726,6 +679,44 @@ "node": ">=20.0.0" } }, + "node_modules/@vercel/speed-insights": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/@vercel/speed-insights/-/speed-insights-2.0.0.tgz", + "integrity": "sha512-jwkNcrTeafWxjmWq4AHBaptSqZiJkYU5adLC9QBSqeim0GcqDMgN5Ievh8OG1rJ6W3A4l1oiP7qr9CWxGuzu3w==", + "license": "Apache-2.0", + "peerDependencies": { + "@sveltejs/kit": "^1 || ^2", + "next": ">= 13", + "nuxt": ">= 3", + "react": "^18 || ^19 || ^19.0.0-rc", + "svelte": ">= 4", + "vue": "^3", + "vue-router": "^4" + }, + "peerDependenciesMeta": { + "@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/acorn": { "version": "8.17.0", "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.17.0.tgz", diff --git a/package.json b/package.json index b483049..a412d77 100644 --- a/package.json +++ b/package.json @@ -49,6 +49,7 @@ "dependencies": { "@supabase/ssr": "^0.12.0", "@supabase/supabase-js": "^2.108.1", + "@vercel/speed-insights": "^2.0.0", "hls.js": "^1.6.16", "sharp": "0.35.2" },