speed insights

Vercel 速度见解

您网站的性能洞察

网站·文档· Twitter

概述

@vercel/speed-insights自动跟踪您网站的网络生命周期和其他性能指标。

该包不跟踪开发模式下的数据。

它具有一级集成：

框架	包裹
Next.js	@vercel/speed-insights/next
努克斯特	@vercel/speed-insights/nuxt
斯维尔特基特	@vercel/speed-insights/sveltekit
混音	@vercel/speed-insights/remix
反应	@vercel/speed-insights/react
阿斯特罗	@vercel/speed-insights/astro
维埃	@vercel/speed-insights/vue

它还支持其他框架、vanilla JS 和静态网站。

快速入门

1. 在 Vercel 仪表板中为项目启用 Vercel Speed Insights。

2. 将@vercel/speed-insights包添加到您的项目中

3. 将速度洞察注入您的应用程序

   • 如果您使用Next.js 、 React 、 Nuxt或Vue ，您可以使用特定于框架的<SpeedInsights />组件将脚本注入到您的应用程序中。
   • 如果您使用Sveltekit ，则可以在顶级+layout.js/ts文件中使用injectSpeedInsights()函数@vercel/speed-insights/sveltekit 。
   • 对于其他框架，您可以使用inject功能将跟踪脚本添加到您的应用程序中。
   • 如果您想在没有 npm 的静态站点上使用 Vercel Speed Insights，请按照文档中的说明进行操作。

4. 将您的应用程序部署到 Vercel 并查看数据流入。

文档

在我们的文档中查找有关此包的更多详细信息。