自訂報告

您也可以使用 Next.js Speed Insights 內建的轉發器，將資料傳送到自己的服務或推送至 Google Analytics。

現在讓我們看看如何實現這個功能。我們可以將它加入到我們一直在優化的示範應用程式中。

我們將使用 console.log 來即時查看指標。

為此，我們可以利用 Next.js 提供的 reportWebVitals 函式。

注意： 如果您剛完成前面的課程，則不需要進行此操作。

npx create-next-app@latest nextjs-lighthouse --use-npm --example "https://github.com/vercel/next-learn/tree/main/seo"

開啟 pages/_app.js 並匯出以下函式：

export function reportWebVitals(metric) {
  console.log(metric);
}

然後建置並啟動您的應用程式：

npm run build && npm run start

如果您開啟 Chrome，將會在 DevTools 控制台中看到指標。您還會注意到 FID 只有在與頁面互動時才會觸發。

延伸閱讀

• Next.js: 效能測量