add method to measure Interaction to Next Paint (INP)

`web-vitals` CHANGELOG for v3:

- [BREAKING] Report TTFB after a bfcache restore
- [BREAKING] Only include last LCP entry in metric entries
- Add support for the new INP metric
- Rename getXXX() functions to onXXX()
- Add a navigationType property to the Metric object

See https://github.com/GoogleChrome/web-vitals/blob/next/CHANGELOG.md

packages/next/client/performance-relayer.ts

@@ -1,17 +1,18 @@
 /* global location */
 import {
-  getCLS,
-  getFCP,
-  getFID,
-  getLCP,
-  getTTFB,
+  onCLS,
+  onFCP,
+  onFID,
+  onINP,
+  onLCP,
+  onTTFB,
   Metric,
-  ReportHandler,
+  ReportCallback,
 } from 'next/dist/compiled/web-vitals'
 
 const initialHref = location.href
 let isRegistered = false
-let userReportHandler: ReportHandler | undefined
+let userReportHandler: ReportCallback | undefined
 
 function onReport(metric: Metric): void {
   if (userReportHandler) {
@@ -71,7 +72,7 @@ function onReport(metric: Metric): void {
   }
 }
 
-export default (onPerfEntry?: ReportHandler): void => {
+export default (onPerfEntry?: ReportCallback): void => {
   // Update function if it changes:
   userReportHandler = onPerfEntry
 
@@ -81,9 +82,10 @@ export default (onPerfEntry?: ReportHandler): void => {
   }
   isRegistered = true
 
-  getCLS(onReport)
-  getFID(onReport)
-  getFCP(onReport)
-  getLCP(onReport)
-  getTTFB(onReport)
+  onCLS(onReport)
+  onFID(onReport)
+  onFCP(onReport)
+  onLCP(onReport)
+  onTTFB(onReport)
+  onINP(onReport)
 }

packages/next/package.json

@@ -266,7 +266,7 @@
     "vm-browserify": "1.1.2",
     "watchpack": "2.3.1",
     "web-streams-polyfill": "3.0.3",
-    "web-vitals": "2.1.0",
+    "web-vitals": "3.0.0-beta.2",
     "webpack-sources1": "npm:webpack-sources@1.4.3",
     "webpack-sources3": "npm:webpack-sources@3.2.3",
     "webpack4": "npm:webpack@4.44.1",

yarn.lock

@@ -21537,10 +21537,10 @@ web-streams-polyfill@4.0.0-beta.1:
   resolved "https://registry.yarnpkg.com/web-streams-polyfill/-/web-streams-polyfill-4.0.0-beta.1.tgz#3b19b9817374b7cee06d374ba7eeb3aeb80e8c95"
   integrity sha512-3ux37gEX670UUphBF9AMCq8XM6iQ8Ac6A+DSRRjDoRBm1ufCkaCDdNVbaqq60PsEkdNlLKrGtv/YBP4EJXqNtQ==
 
-web-vitals@2.1.0:
-  version "2.1.0"
-  resolved "https://registry.yarnpkg.com/web-vitals/-/web-vitals-2.1.0.tgz#ebf5428875ab5bfc1056c2e80cd177001287de7b"
-  integrity sha512-npEyJP8jHf3J71t1tRTEtz9FeKp8H2udWJUUq5ykfPhhstr//TUxiYhIEzLNwk4zv2ybAilMn7v7N6Mxmuitmg==
+web-vitals@3.0.0-beta.2:
+  version "3.0.0-beta.2"
+  resolved "https://registry.yarnpkg.com/web-vitals/-/web-vitals-3.0.0-beta.2.tgz#08c605295f36484256ee3acb5735b1f4dc9cd565"
+  integrity sha512-W9OALsWK4RkA5GWvLhsfszy+Q29WJBB27Dnucc3eYP6/0kz1XsfMgm+4au9X/KjXMIo92ZRU1fWBaSdNsaVjJg==
 
 webcrypto-core@^1.6.0:
   version "1.6.0"