add method to measure Interaction to Next Paint (INP)

vercel · Apr 26, 2022 · a238eb5 · a238eb5
1 parent 90863c7
commit a238eb5
Show file tree

Hide file tree

Showing 9 changed files with 113,923 additions and 113,843 deletions.
diff --git a/docs/advanced-features/measuring-performance.md b/docs/advanced-features/measuring-performance.md
@@ -54,6 +54,7 @@ experience of a web page. The following web vitals are all included:
 - [Largest Contentful Paint](https://web.dev/lcp/) (LCP)
 - [First Input Delay](https://web.dev/fid/) (FID)
 - [Cumulative Layout Shift](https://web.dev/cls/) (CLS)
+- [Experimental: Interaction to Next Paint](https://web.dev/responsiveness/) (INP)
 
 You can handle all the results of these metrics using the `web-vital` label:
 
@@ -85,6 +86,9 @@ export function reportWebVitals(metric) {
     case 'TTFB':
       // handle TTFB results
       break
+    case 'INP':
+      // handle INP results
+      break
     default:
       break
   }

diff --git a/packages/next/client/performance-relayer.ts b/packages/next/client/performance-relayer.ts
@@ -1,10 +1,11 @@
 /* global location */
 import {
-  getCLS,
-  getFCP,
-  getFID,
-  getLCP,
-  getTTFB,
+  onCLS,
+  onFCP,
+  onFID,
+  onINP,
+  onLCP,
+  onTTFB,
   Metric,
   ReportHandler,
 } from 'next/dist/compiled/web-vitals'
@@ -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)
 }
diff --git a/packages/next/compiled/babel-packages/packages-bundle.js b/packages/next/compiled/babel-packages/packages-bundle.js
diff --git a/packages/next/compiled/babel/bundle.js b/packages/next/compiled/babel/bundle.js
diff --git a/packages/next/compiled/web-vitals/web-vitals.umd.js b/packages/next/compiled/web-vitals/web-vitals.umd.js