Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Call Web Vitals reporting at correct time #17933

Merged
merged 4 commits into from Oct 16, 2020
Merged

Call Web Vitals reporting at correct time #17933

merged 4 commits into from Oct 16, 2020

Conversation

Timer
Copy link
Member

@Timer Timer commented Oct 16, 2020 •
edited

This PR adjust the Web Vitals reporting to be called after rendering occurs. It used to work like this, but React's render method is no longer synchronous—so we have to do it in an effect.

Existing tests should cover this code path, and IMO it's unfeasible to test that it's invoked after hydration.

Also removed the && ST condition which is not relevant to Web Vitals.

@Timer Timer changed the title Ensure Web Vitals reporting is called Call Web Vitals reporting at correct time Oct 16, 2020
@ijjk
Copy link
Member

ijjk commented Oct 16, 2020

Stats from current PR

Default Server Mode (Increase detected ⚠️)
General Overall increase ⚠️
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
buildDuration 13.8s 13.6s -239ms
nodeModulesSize 64.3 MB 64.3 MB ⚠️ +321 B
Page Load Tests Overall decrease ⚠️
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
/ failed reqs 0 0 ✓
/ total time (seconds) 2.447 2.512 ⚠️ +0.06
/ avg req/sec 1021.62 995.12 ⚠️ -26.5
/error-in-render failed reqs 0 0 ✓
/error-in-render total time (seconds) 1.362 1.426 ⚠️ +0.06
/error-in-render avg req/sec 1836.02 1753.37 ⚠️ -82.65
Client Bundles (main, webpack, commons) Overall increase ⚠️
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
677f882d2ed8..7765.js gzip 11.1 kB 11.1 kB ✓
framework.HASH.js gzip 39 kB 39 kB ✓
main-43e96dd..7c44.js gzip 7.3 kB 7.31 kB ⚠️ +7 B
webpack-e067..f178.js gzip 751 B 751 B ✓
Overall change 58.1 kB 58.1 kB ⚠️ +7 B
Client Bundles (main, webpack, commons) Modern Overall increase ⚠️
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
677f882d2ed8..dule.js gzip 6.94 kB 6.94 kB ✓
framework.HA..dule.js gzip 39 kB 39 kB ✓
main-ee66c17..dule.js gzip 6.29 kB 6.3 kB ⚠️ +6 B
webpack-07c5..dule.js gzip 751 B 751 B ✓
Overall change 53 kB 53 kB ⚠️ +6 B
Legacy Client Bundles (polyfills)
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
polyfills-4b..e242.js gzip 31 kB 31 kB ✓
Overall change 31 kB 31 kB ✓
Client Pages
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
_app-9a0b9e1..b37e.js gzip 1.28 kB 1.28 kB ✓
_error-ed1b0..8fbd.js gzip 3.44 kB 3.44 kB ✓
hooks-89731c..c609.js gzip 887 B 887 B ✓
index-17468f..5d83.js gzip 227 B 227 B ✓
link-89ad9e7..25bb.js gzip 1.34 kB 1.34 kB ✓
routerDirect..924c.js gzip 284 B 284 B ✓
withRouter-7..c13d.js gzip 284 B 284 B ✓
Overall change 7.74 kB 7.74 kB ✓
Client Pages Modern
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
_app-75d3a82..dule.js gzip 625 B 625 B ✓
_error-4469a..dule.js gzip 2.29 kB 2.29 kB ✓
hooks-cbf13f..dule.js gzip 387 B 387 B ✓
index-b9a643..dule.js gzip 226 B 226 B ✓
link-aeb707b..dule.js gzip 1.29 kB 1.29 kB ✓
routerDirect..dule.js gzip 284 B 284 B ✓
withRouter-f..dule.js gzip 282 B 282 B ✓
Overall change 5.39 kB 5.39 kB ✓
Client Build Manifests
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
_buildManifest.js gzip 322 B 322 B ✓
_buildManife..dule.js gzip 329 B 329 B ✓
Overall change 651 B 651 B ✓
Rendered Page Sizes Overall increase ⚠️
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
index.html gzip 1 kB 1 kB ⚠️ +1 B
link.html gzip 1.01 kB 1.01 kB ⚠️ +2 B
withRouter.html gzip 995 B 995 B ✓
Overall change 3.01 kB 3.01 kB ⚠️ +3 B

Diffs

Diff for main-32c48d3..47fa3ff41.js 
@@ -857,10 +857,6 @@ _N_E = (window["webpackJsonp_N_E"] = window["webpackJsonp_N_E"] || []).push([
             _reactDom["default"].hydrate(reactEl, domEl, markHydrateComplete);
 
             isInitialRender = false;
-
-            if (onPerfEntry && _utils.ST) {
-              (0, _performanceRelayer["default"])(onPerfEntry);
-            }
           } else {
             _reactDom["default"].render(reactEl, domEl, markRenderComplete);
           }
@@ -1157,7 +1153,14 @@ _N_E = (window["webpackJsonp_N_E"] = window["webpackJsonp_N_E"] || []).push([
               window.__NEXT_HYDRATED_CB();
             }
           }, []);
-        }
+        } // We should ask to measure the Web Vitals after rendering completes so we
+        // don't cause any hydration delay:
+
+        _react["default"].useEffect(function() {
+          if (onPerfEntry) {
+            (0, _performanceRelayer["default"])(onPerfEntry);
+          }
+        }, []);
 
         return children;
       }
Diff for main-f1e531e..6f.module.js 
@@ -602,10 +602,6 @@
             _reactDom.default.hydrate(reactEl, domEl, markHydrateComplete);
 
             isInitialRender = false;
-
-            if (onPerfEntry && _utils.ST) {
-              (0, _performanceRelayer.default)(onPerfEntry);
-            }
           } else {
             _reactDom.default.render(reactEl, domEl, markRenderComplete);
           }
@@ -879,7 +875,14 @@
               window.__NEXT_HYDRATED_CB();
             }
           }, []);
-        }
+        } // We should ask to measure the Web Vitals after rendering completes so we
+        // don't cause any hydration delay:
+
+        _react.default.useEffect(() => {
+          if (onPerfEntry) {
+            (0, _performanceRelayer.default)(onPerfEntry);
+          }
+        }, []);
 
         return children;
       }
Diff for index.html 
@@ -6,7 +6,7 @@
     <noscript data-n-css="true"></noscript>
     <link
       rel="preload"
-      href="/_next/static/chunks/main-f1e531e41c50db5e466f.module.js"
+      href="/_next/static/chunks/main-f952ff6be144c4cad4cc.module.js"
       as="script"
       crossorigin="anonymous"
     />
@@ -85,13 +85,13 @@
       src="/_next/static/chunks/polyfills-f73ba3fc145972ef83e9.js"
     ></script>
     <script
-      src="/_next/static/chunks/main-32c48d3fa8f47fa3ff41.js"
+      src="/_next/static/chunks/main-099969bbf06ca1306993.js"
       async=""
       crossorigin="anonymous"
       nomodule=""
     ></script>
     <script
-      src="/_next/static/chunks/main-f1e531e41c50db5e466f.module.js"
+      src="/_next/static/chunks/main-f952ff6be144c4cad4cc.module.js"
       async=""
       crossorigin="anonymous"
       type="module"
Diff for link.html 
@@ -6,7 +6,7 @@
     <noscript data-n-css="true"></noscript>
     <link
       rel="preload"
-      href="/_next/static/chunks/main-f1e531e41c50db5e466f.module.js"
+      href="/_next/static/chunks/main-f952ff6be144c4cad4cc.module.js"
       as="script"
       crossorigin="anonymous"
     />
@@ -90,13 +90,13 @@
       src="/_next/static/chunks/polyfills-f73ba3fc145972ef83e9.js"
     ></script>
     <script
-      src="/_next/static/chunks/main-32c48d3fa8f47fa3ff41.js"
+      src="/_next/static/chunks/main-099969bbf06ca1306993.js"
       async=""
       crossorigin="anonymous"
       nomodule=""
     ></script>
     <script
-      src="/_next/static/chunks/main-f1e531e41c50db5e466f.module.js"
+      src="/_next/static/chunks/main-f952ff6be144c4cad4cc.module.js"
       async=""
       crossorigin="anonymous"
       type="module"
Diff for withRouter.html 
@@ -6,7 +6,7 @@
     <noscript data-n-css="true"></noscript>
     <link
       rel="preload"
-      href="/_next/static/chunks/main-f1e531e41c50db5e466f.module.js"
+      href="/_next/static/chunks/main-f952ff6be144c4cad4cc.module.js"
       as="script"
       crossorigin="anonymous"
     />
@@ -85,13 +85,13 @@
       src="/_next/static/chunks/polyfills-f73ba3fc145972ef83e9.js"
     ></script>
     <script
-      src="/_next/static/chunks/main-32c48d3fa8f47fa3ff41.js"
+      src="/_next/static/chunks/main-099969bbf06ca1306993.js"
       async=""
       crossorigin="anonymous"
       nomodule=""
     ></script>
     <script
-      src="/_next/static/chunks/main-f1e531e41c50db5e466f.module.js"
+      src="/_next/static/chunks/main-f952ff6be144c4cad4cc.module.js"
       async=""
       crossorigin="anonymous"
       type="module"
Serverless Mode (Increase detected ⚠️)
General Overall increase ⚠️
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
buildDuration 15.5s 15.6s ⚠️ +168ms
nodeModulesSize 64.3 MB 64.3 MB ⚠️ +321 B
Client Bundles (main, webpack, commons) Overall increase ⚠️
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
677f882d2ed8..7765.js gzip 11.1 kB 11.1 kB ✓
framework.HASH.js gzip 39 kB 39 kB ✓
main-43e96dd..7c44.js gzip 7.3 kB N/A N/A
webpack-e067..f178.js gzip 751 B 751 B ✓
main-2396d48..fce3.js gzip N/A 7.31 kB N/A
Overall change 58.1 kB 58.1 kB ⚠️ +7 B
Client Bundles (main, webpack, commons) Modern Overall increase ⚠️
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
677f882d2ed8..dule.js gzip 6.94 kB 6.94 kB ✓
framework.HA..dule.js gzip 39 kB 39 kB ✓
main-ee66c17..dule.js gzip 6.29 kB N/A N/A
webpack-07c5..dule.js gzip 751 B 751 B ✓
main-0922705..dule.js gzip N/A 6.3 kB N/A
Overall change 53 kB 53 kB ⚠️ +6 B
Legacy Client Bundles (polyfills)
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
polyfills-4b..e242.js gzip 31 kB 31 kB ✓
Overall change 31 kB 31 kB ✓
Client Pages
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
_app-9a0b9e1..b37e.js gzip 1.28 kB 1.28 kB ✓
_error-ed1b0..8fbd.js gzip 3.44 kB 3.44 kB ✓
hooks-89731c..c609.js gzip 887 B 887 B ✓
index-17468f..5d83.js gzip 227 B 227 B ✓
link-89ad9e7..25bb.js gzip 1.34 kB 1.34 kB ✓
routerDirect..924c.js gzip 284 B 284 B ✓
withRouter-7..c13d.js gzip 284 B 284 B ✓
Overall change 7.74 kB 7.74 kB ✓
Client Pages Modern
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
_app-75d3a82..dule.js gzip 625 B 625 B ✓
_error-4469a..dule.js gzip 2.29 kB 2.29 kB ✓
hooks-cbf13f..dule.js gzip 387 B 387 B ✓
index-b9a643..dule.js gzip 226 B 226 B ✓
link-aeb707b..dule.js gzip 1.29 kB 1.29 kB ✓
routerDirect..dule.js gzip 284 B 284 B ✓
withRouter-f..dule.js gzip 282 B 282 B ✓
Overall change 5.39 kB 5.39 kB ✓
Client Build Manifests
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
_buildManifest.js gzip 322 B 322 B ✓
_buildManife..dule.js gzip 329 B 329 B ✓
Overall change 651 B 651 B ✓
Serverless bundles
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
_error.js 1.06 MB 1.06 MB ✓
404.html 4.34 kB 4.34 kB ✓
hooks.html 3.92 kB 3.92 kB ✓
index.js 1.06 MB 1.06 MB ✓
link.js 1.1 MB 1.1 MB ✓
routerDirect.js 1.1 MB 1.1 MB ✓
withRouter.js 1.1 MB 1.1 MB ✓
Overall change 5.42 MB 5.42 MB ✓
Commit: 0466701

@ijjk
Copy link
Member

ijjk commented Oct 16, 2020

Stats from current PR

Default Server Mode (Increase detected ⚠️)
General Overall increase ⚠️
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
buildDuration 12.9s 12.8s -57ms
nodeModulesSize 64.3 MB 64.3 MB ⚠️ +321 B
Page Load Tests Overall decrease ⚠️
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
/ failed reqs 0 0 ✓
/ total time (seconds) 2.337 2.321 -0.02
/ avg req/sec 1069.62 1077.29 +7.67
/error-in-render failed reqs 0 0 ✓
/error-in-render total time (seconds) 1.247 1.281 ⚠️ +0.03
/error-in-render avg req/sec 2004.94 1951.35 ⚠️ -53.59
Client Bundles (main, webpack, commons) Overall increase ⚠️
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
677f882d2ed8..7765.js gzip 11.1 kB 11.1 kB ✓
framework.HASH.js gzip 39 kB 39 kB ✓
main-43e96dd..7c44.js gzip 7.3 kB 7.31 kB ⚠️ +7 B
webpack-e067..f178.js gzip 751 B 751 B ✓
Overall change 58.1 kB 58.1 kB ⚠️ +7 B
Client Bundles (main, webpack, commons) Modern Overall increase ⚠️
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
677f882d2ed8..dule.js gzip 6.94 kB 6.94 kB ✓
framework.HA..dule.js gzip 39 kB 39 kB ✓
main-ee66c17..dule.js gzip 6.29 kB 6.3 kB ⚠️ +6 B
webpack-07c5..dule.js gzip 751 B 751 B ✓
Overall change 53 kB 53 kB ⚠️ +6 B
Legacy Client Bundles (polyfills)
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
polyfills-4b..e242.js gzip 31 kB 31 kB ✓
Overall change 31 kB 31 kB ✓
Client Pages
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
_app-9a0b9e1..b37e.js gzip 1.28 kB 1.28 kB ✓
_error-ed1b0..8fbd.js gzip 3.44 kB 3.44 kB ✓
hooks-89731c..c609.js gzip 887 B 887 B ✓
index-17468f..5d83.js gzip 227 B 227 B ✓
link-89ad9e7..25bb.js gzip 1.34 kB 1.34 kB ✓
routerDirect..924c.js gzip 284 B 284 B ✓
withRouter-7..c13d.js gzip 284 B 284 B ✓
Overall change 7.74 kB 7.74 kB ✓
Client Pages Modern
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
_app-75d3a82..dule.js gzip 625 B 625 B ✓
_error-4469a..dule.js gzip 2.29 kB 2.29 kB ✓
hooks-cbf13f..dule.js gzip 387 B 387 B ✓
index-b9a643..dule.js gzip 226 B 226 B ✓
link-aeb707b..dule.js gzip 1.29 kB 1.29 kB ✓
routerDirect..dule.js gzip 284 B 284 B ✓
withRouter-f..dule.js gzip 282 B 282 B ✓
Overall change 5.39 kB 5.39 kB ✓
Client Build Manifests
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
_buildManifest.js gzip 322 B 322 B ✓
_buildManife..dule.js gzip 329 B 329 B ✓
Overall change 651 B 651 B ✓
Rendered Page Sizes Overall increase ⚠️
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
index.html gzip 1 kB 1 kB ⚠️ +1 B
link.html gzip 1.01 kB 1.01 kB ⚠️ +2 B
withRouter.html gzip 995 B 995 B ✓
Overall change 3.01 kB 3.01 kB ⚠️ +3 B

Diffs

Diff for main-32c48d3..47fa3ff41.js 
@@ -857,10 +857,6 @@ _N_E = (window["webpackJsonp_N_E"] = window["webpackJsonp_N_E"] || []).push([
             _reactDom["default"].hydrate(reactEl, domEl, markHydrateComplete);
 
             isInitialRender = false;
-
-            if (onPerfEntry && _utils.ST) {
-              (0, _performanceRelayer["default"])(onPerfEntry);
-            }
           } else {
             _reactDom["default"].render(reactEl, domEl, markRenderComplete);
           }
@@ -1157,7 +1153,14 @@ _N_E = (window["webpackJsonp_N_E"] = window["webpackJsonp_N_E"] || []).push([
               window.__NEXT_HYDRATED_CB();
             }
           }, []);
-        }
+        } // We should ask to measure the Web Vitals after rendering completes so we
+        // don't cause any hydration delay:
+
+        _react["default"].useEffect(function() {
+          if (onPerfEntry) {
+            (0, _performanceRelayer["default"])(onPerfEntry);
+          }
+        }, []);
 
         return children;
       }
Diff for main-f1e531e..6f.module.js 
@@ -602,10 +602,6 @@
             _reactDom.default.hydrate(reactEl, domEl, markHydrateComplete);
 
             isInitialRender = false;
-
-            if (onPerfEntry && _utils.ST) {
-              (0, _performanceRelayer.default)(onPerfEntry);
-            }
           } else {
             _reactDom.default.render(reactEl, domEl, markRenderComplete);
           }
@@ -879,7 +875,14 @@
               window.__NEXT_HYDRATED_CB();
             }
           }, []);
-        }
+        } // We should ask to measure the Web Vitals after rendering completes so we
+        // don't cause any hydration delay:
+
+        _react.default.useEffect(() => {
+          if (onPerfEntry) {
+            (0, _performanceRelayer.default)(onPerfEntry);
+          }
+        }, []);
 
         return children;
       }
Diff for index.html 
@@ -6,7 +6,7 @@
     <noscript data-n-css="true"></noscript>
     <link
       rel="preload"
-      href="/_next/static/chunks/main-f1e531e41c50db5e466f.module.js"
+      href="/_next/static/chunks/main-f952ff6be144c4cad4cc.module.js"
       as="script"
       crossorigin="anonymous"
     />
@@ -85,13 +85,13 @@
       src="/_next/static/chunks/polyfills-f73ba3fc145972ef83e9.js"
     ></script>
     <script
-      src="/_next/static/chunks/main-32c48d3fa8f47fa3ff41.js"
+      src="/_next/static/chunks/main-099969bbf06ca1306993.js"
       async=""
       crossorigin="anonymous"
       nomodule=""
     ></script>
     <script
-      src="/_next/static/chunks/main-f1e531e41c50db5e466f.module.js"
+      src="/_next/static/chunks/main-f952ff6be144c4cad4cc.module.js"
       async=""
       crossorigin="anonymous"
       type="module"
Diff for link.html 
@@ -6,7 +6,7 @@
     <noscript data-n-css="true"></noscript>
     <link
       rel="preload"
-      href="/_next/static/chunks/main-f1e531e41c50db5e466f.module.js"
+      href="/_next/static/chunks/main-f952ff6be144c4cad4cc.module.js"
       as="script"
       crossorigin="anonymous"
     />
@@ -90,13 +90,13 @@
       src="/_next/static/chunks/polyfills-f73ba3fc145972ef83e9.js"
     ></script>
     <script
-      src="/_next/static/chunks/main-32c48d3fa8f47fa3ff41.js"
+      src="/_next/static/chunks/main-099969bbf06ca1306993.js"
       async=""
       crossorigin="anonymous"
       nomodule=""
     ></script>
     <script
-      src="/_next/static/chunks/main-f1e531e41c50db5e466f.module.js"
+      src="/_next/static/chunks/main-f952ff6be144c4cad4cc.module.js"
       async=""
       crossorigin="anonymous"
       type="module"
Diff for withRouter.html 
@@ -6,7 +6,7 @@
     <noscript data-n-css="true"></noscript>
     <link
       rel="preload"
-      href="/_next/static/chunks/main-f1e531e41c50db5e466f.module.js"
+      href="/_next/static/chunks/main-f952ff6be144c4cad4cc.module.js"
       as="script"
       crossorigin="anonymous"
     />
@@ -85,13 +85,13 @@
       src="/_next/static/chunks/polyfills-f73ba3fc145972ef83e9.js"
     ></script>
     <script
-      src="/_next/static/chunks/main-32c48d3fa8f47fa3ff41.js"
+      src="/_next/static/chunks/main-099969bbf06ca1306993.js"
       async=""
       crossorigin="anonymous"
       nomodule=""
     ></script>
     <script
-      src="/_next/static/chunks/main-f1e531e41c50db5e466f.module.js"
+      src="/_next/static/chunks/main-f952ff6be144c4cad4cc.module.js"
       async=""
       crossorigin="anonymous"
       type="module"
Serverless Mode (Increase detected ⚠️)
General Overall increase ⚠️
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
buildDuration 14.3s 14.6s ⚠️ +268ms
nodeModulesSize 64.3 MB 64.3 MB ⚠️ +321 B
Client Bundles (main, webpack, commons) Overall increase ⚠️
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
677f882d2ed8..7765.js gzip 11.1 kB 11.1 kB ✓
framework.HASH.js gzip 39 kB 39 kB ✓
main-43e96dd..7c44.js gzip 7.3 kB N/A N/A
webpack-e067..f178.js gzip 751 B 751 B ✓
main-2396d48..fce3.js gzip N/A 7.31 kB N/A
Overall change 58.1 kB 58.1 kB ⚠️ +7 B
Client Bundles (main, webpack, commons) Modern Overall increase ⚠️
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
677f882d2ed8..dule.js gzip 6.94 kB 6.94 kB ✓
framework.HA..dule.js gzip 39 kB 39 kB ✓
main-ee66c17..dule.js gzip 6.29 kB N/A N/A
webpack-07c5..dule.js gzip 751 B 751 B ✓
main-0922705..dule.js gzip N/A 6.3 kB N/A
Overall change 53 kB 53 kB ⚠️ +6 B
Legacy Client Bundles (polyfills)
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
polyfills-4b..e242.js gzip 31 kB 31 kB ✓
Overall change 31 kB 31 kB ✓
Client Pages
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
_app-9a0b9e1..b37e.js gzip 1.28 kB 1.28 kB ✓
_error-ed1b0..8fbd.js gzip 3.44 kB 3.44 kB ✓
hooks-89731c..c609.js gzip 887 B 887 B ✓
index-17468f..5d83.js gzip 227 B 227 B ✓
link-89ad9e7..25bb.js gzip 1.34 kB 1.34 kB ✓
routerDirect..924c.js gzip 284 B 284 B ✓
withRouter-7..c13d.js gzip 284 B 284 B ✓
Overall change 7.74 kB 7.74 kB ✓
Client Pages Modern
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
_app-75d3a82..dule.js gzip 625 B 625 B ✓
_error-4469a..dule.js gzip 2.29 kB 2.29 kB ✓
hooks-cbf13f..dule.js gzip 387 B 387 B ✓
index-b9a643..dule.js gzip 226 B 226 B ✓
link-aeb707b..dule.js gzip 1.29 kB 1.29 kB ✓
routerDirect..dule.js gzip 284 B 284 B ✓
withRouter-f..dule.js gzip 282 B 282 B ✓
Overall change 5.39 kB 5.39 kB ✓
Client Build Manifests
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
_buildManifest.js gzip 322 B 322 B ✓
_buildManife..dule.js gzip 329 B 329 B ✓
Overall change 651 B 651 B ✓
Serverless bundles
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
_error.js 1.06 MB 1.06 MB ✓
404.html 4.34 kB 4.34 kB ✓
hooks.html 3.92 kB 3.92 kB ✓
index.js 1.06 MB 1.06 MB ✓
link.js 1.1 MB 1.1 MB ✓
routerDirect.js 1.1 MB 1.1 MB ✓
withRouter.js 1.1 MB 1.1 MB ✓
Overall change 5.42 MB 5.42 MB ✓
Commit: a1c8328

@ijjk
Copy link
Member

ijjk commented Oct 16, 2020

Stats from current PR

Default Server Mode (Increase detected ⚠️)
General Overall increase ⚠️
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
buildDuration 10.2s 10.9s ⚠️ +697ms
nodeModulesSize 64.3 MB 64.3 MB ⚠️ +1.16 kB
Page Load Tests Overall decrease ⚠️
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
/ failed reqs 0 0 ✓
/ total time (seconds) 1.968 2.072 ⚠️ +0.1
/ avg req/sec 1270.46 1206.77 ⚠️ -63.69
/error-in-render failed reqs 0 0 ✓
/error-in-render total time (seconds) 1.047 1.137 ⚠️ +0.09
/error-in-render avg req/sec 2388.22 2198.81 ⚠️ -189.41
Client Bundles (main, webpack, commons) Overall increase ⚠️
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
677f882d2ed8..7765.js gzip 11.1 kB 11.1 kB ✓
framework.HASH.js gzip 39 kB 39 kB ✓
main-43e96dd..7c44.js gzip 7.3 kB 7.33 kB ⚠️ +28 B
webpack-e067..f178.js gzip 751 B 751 B ✓
Overall change 58.1 kB 58.1 kB ⚠️ +28 B
Client Bundles (main, webpack, commons) Modern Overall increase ⚠️
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
677f882d2ed8..dule.js gzip 6.94 kB 6.94 kB ✓
framework.HA..dule.js gzip 39 kB 39 kB ✓
main-ee66c17..dule.js gzip 6.29 kB 6.32 kB ⚠️ +22 B
webpack-07c5..dule.js gzip 751 B 751 B ✓
Overall change 53 kB 53 kB ⚠️ +22 B
Legacy Client Bundles (polyfills)
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
polyfills-4b..e242.js gzip 31 kB 31 kB ✓
Overall change 31 kB 31 kB ✓
Client Pages
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
_app-9a0b9e1..b37e.js gzip 1.28 kB 1.28 kB ✓
_error-ed1b0..8fbd.js gzip 3.44 kB 3.44 kB ✓
hooks-89731c..c609.js gzip 887 B 887 B ✓
index-17468f..5d83.js gzip 227 B 227 B ✓
link-89ad9e7..25bb.js gzip 1.34 kB 1.34 kB ✓
routerDirect..924c.js gzip 284 B 284 B ✓
withRouter-7..c13d.js gzip 284 B 284 B ✓
Overall change 7.74 kB 7.74 kB ✓
Client Pages Modern
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
_app-75d3a82..dule.js gzip 625 B 625 B ✓
_error-4469a..dule.js gzip 2.29 kB 2.29 kB ✓
hooks-cbf13f..dule.js gzip 387 B 387 B ✓
index-b9a643..dule.js gzip 226 B 226 B ✓
link-aeb707b..dule.js gzip 1.29 kB 1.29 kB ✓
routerDirect..dule.js gzip 284 B 284 B ✓
withRouter-f..dule.js gzip 282 B 282 B ✓
Overall change 5.39 kB 5.39 kB ✓
Client Build Manifests
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
_buildManifest.js gzip 322 B 322 B ✓
_buildManife..dule.js gzip 329 B 329 B ✓
Overall change 651 B 651 B ✓
Rendered Page Sizes Overall decrease ✓
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
index.html gzip 1 kB 1 kB -1 B
link.html gzip 1.01 kB 1.01 kB -1 B
withRouter.html gzip 995 B 996 B ⚠️ +1 B
Overall change 3.01 kB 3.01 kB -1 B

Diffs

Diff for main-32c48d3..47fa3ff41.js 
@@ -857,10 +857,6 @@ _N_E = (window["webpackJsonp_N_E"] = window["webpackJsonp_N_E"] || []).push([
             _reactDom["default"].hydrate(reactEl, domEl, markHydrateComplete);
 
             isInitialRender = false;
-
-            if (onPerfEntry && _utils.ST) {
-              (0, _performanceRelayer["default"])(onPerfEntry);
-            }
           } else {
             _reactDom["default"].render(reactEl, domEl, markRenderComplete);
           }
@@ -1157,7 +1153,12 @@ _N_E = (window["webpackJsonp_N_E"] = window["webpackJsonp_N_E"] || []).push([
               window.__NEXT_HYDRATED_CB();
             }
           }, []);
-        }
+        } // We should ask to measure the Web Vitals after rendering completes so we
+        // don't cause any hydration delay:
+
+        _react["default"].useEffect(function() {
+          (0, _performanceRelayer["default"])(onPerfEntry);
+        }, []);
 
         return children;
       }
@@ -1249,12 +1250,29 @@ _N_E = (window["webpackJsonp_N_E"] = window["webpackJsonp_N_E"] || []).push([
 
       var _webVitals = __webpack_require__("w6Sm");
 
+      var isRegistered = false;
+      var userReportHandler;
+
+      function onReport(metric) {
+        if (userReportHandler) {
+          userReportHandler(metric);
+        }
+      }
+
       var _default = function _default(onPerfEntry) {
-        (0, _webVitals.getCLS)(onPerfEntry);
-        (0, _webVitals.getFID)(onPerfEntry);
-        (0, _webVitals.getFCP)(onPerfEntry);
-        (0, _webVitals.getLCP)(onPerfEntry);
-        (0, _webVitals.getTTFB)(onPerfEntry);
+        // Update function if it changes:
+        userReportHandler = onPerfEntry; // Only register listeners once:
+
+        if (isRegistered) {
+          return;
+        }
+
+        isRegistered = true;
+        (0, _webVitals.getCLS)(onReport);
+        (0, _webVitals.getFID)(onReport);
+        (0, _webVitals.getFCP)(onReport);
+        (0, _webVitals.getLCP)(onReport);
+        (0, _webVitals.getTTFB)(onReport);
       };
 
       exports["default"] = _default;
Diff for main-f1e531e..6f.module.js 
@@ -602,10 +602,6 @@
             _reactDom.default.hydrate(reactEl, domEl, markHydrateComplete);
 
             isInitialRender = false;
-
-            if (onPerfEntry && _utils.ST) {
-              (0, _performanceRelayer.default)(onPerfEntry);
-            }
           } else {
             _reactDom.default.render(reactEl, domEl, markRenderComplete);
           }
@@ -879,7 +875,12 @@
               window.__NEXT_HYDRATED_CB();
             }
           }, []);
-        }
+        } // We should ask to measure the Web Vitals after rendering completes so we
+        // don't cause any hydration delay:
+
+        _react.default.useEffect(() => {
+          (0, _performanceRelayer.default)(onPerfEntry);
+        }, []);
 
         return children;
       }
@@ -919,12 +920,29 @@
 
       var _webVitals = __webpack_require__("w6Sm");
 
+      var isRegistered = false;
+      var userReportHandler;
+
+      function onReport(metric) {
+        if (userReportHandler) {
+          userReportHandler(metric);
+        }
+      }
+
       var _default = onPerfEntry => {
-        (0, _webVitals.getCLS)(onPerfEntry);
-        (0, _webVitals.getFID)(onPerfEntry);
-        (0, _webVitals.getFCP)(onPerfEntry);
-        (0, _webVitals.getLCP)(onPerfEntry);
-        (0, _webVitals.getTTFB)(onPerfEntry);
+        // Update function if it changes:
+        userReportHandler = onPerfEntry; // Only register listeners once:
+
+        if (isRegistered) {
+          return;
+        }
+
+        isRegistered = true;
+        (0, _webVitals.getCLS)(onReport);
+        (0, _webVitals.getFID)(onReport);
+        (0, _webVitals.getFCP)(onReport);
+        (0, _webVitals.getLCP)(onReport);
+        (0, _webVitals.getTTFB)(onReport);
       };
 
       exports.default = _default;
Diff for index.html 
@@ -6,7 +6,7 @@
     <noscript data-n-css="true"></noscript>
     <link
       rel="preload"
-      href="/_next/static/chunks/main-f1e531e41c50db5e466f.module.js"
+      href="/_next/static/chunks/main-1a272751c87e3e75cfce.module.js"
       as="script"
       crossorigin="anonymous"
     />
@@ -85,13 +85,13 @@
       src="/_next/static/chunks/polyfills-f73ba3fc145972ef83e9.js"
     ></script>
     <script
-      src="/_next/static/chunks/main-32c48d3fa8f47fa3ff41.js"
+      src="/_next/static/chunks/main-02ee662035354b1db7eb.js"
       async=""
       crossorigin="anonymous"
       nomodule=""
     ></script>
     <script
-      src="/_next/static/chunks/main-f1e531e41c50db5e466f.module.js"
+      src="/_next/static/chunks/main-1a272751c87e3e75cfce.module.js"
       async=""
       crossorigin="anonymous"
       type="module"
Diff for link.html 
@@ -6,7 +6,7 @@
     <noscript data-n-css="true"></noscript>
     <link
       rel="preload"
-      href="/_next/static/chunks/main-f1e531e41c50db5e466f.module.js"
+      href="/_next/static/chunks/main-1a272751c87e3e75cfce.module.js"
       as="script"
       crossorigin="anonymous"
     />
@@ -90,13 +90,13 @@
       src="/_next/static/chunks/polyfills-f73ba3fc145972ef83e9.js"
     ></script>
     <script
-      src="/_next/static/chunks/main-32c48d3fa8f47fa3ff41.js"
+      src="/_next/static/chunks/main-02ee662035354b1db7eb.js"
       async=""
       crossorigin="anonymous"
       nomodule=""
     ></script>
     <script
-      src="/_next/static/chunks/main-f1e531e41c50db5e466f.module.js"
+      src="/_next/static/chunks/main-1a272751c87e3e75cfce.module.js"
       async=""
       crossorigin="anonymous"
       type="module"
Diff for withRouter.html 
@@ -6,7 +6,7 @@
     <noscript data-n-css="true"></noscript>
     <link
       rel="preload"
-      href="/_next/static/chunks/main-f1e531e41c50db5e466f.module.js"
+      href="/_next/static/chunks/main-1a272751c87e3e75cfce.module.js"
       as="script"
       crossorigin="anonymous"
     />
@@ -85,13 +85,13 @@
       src="/_next/static/chunks/polyfills-f73ba3fc145972ef83e9.js"
     ></script>
     <script
-      src="/_next/static/chunks/main-32c48d3fa8f47fa3ff41.js"
+      src="/_next/static/chunks/main-02ee662035354b1db7eb.js"
       async=""
       crossorigin="anonymous"
       nomodule=""
     ></script>
     <script
-      src="/_next/static/chunks/main-f1e531e41c50db5e466f.module.js"
+      src="/_next/static/chunks/main-1a272751c87e3e75cfce.module.js"
       async=""
       crossorigin="anonymous"
       type="module"
Serverless Mode (Increase detected ⚠️)
General Overall increase ⚠️
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
buildDuration 11.8s 12.2s ⚠️ +421ms
nodeModulesSize 64.3 MB 64.3 MB ⚠️ +1.16 kB
Client Bundles (main, webpack, commons) Overall increase ⚠️
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
677f882d2ed8..7765.js gzip 11.1 kB 11.1 kB ✓
framework.HASH.js gzip 39 kB 39 kB ✓
main-43e96dd..7c44.js gzip 7.3 kB N/A N/A
webpack-e067..f178.js gzip 751 B 751 B ✓
main-1e58cc5..96bb.js gzip N/A 7.33 kB N/A
Overall change 58.1 kB 58.1 kB ⚠️ +28 B
Client Bundles (main, webpack, commons) Modern Overall increase ⚠️
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
677f882d2ed8..dule.js gzip 6.94 kB 6.94 kB ✓
framework.HA..dule.js gzip 39 kB 39 kB ✓
main-ee66c17..dule.js gzip 6.29 kB N/A N/A
webpack-07c5..dule.js gzip 751 B 751 B ✓
main-1eeec67..dule.js gzip N/A 6.32 kB N/A
Overall change 53 kB 53 kB ⚠️ +22 B
Legacy Client Bundles (polyfills)
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
polyfills-4b..e242.js gzip 31 kB 31 kB ✓
Overall change 31 kB 31 kB ✓
Client Pages
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
_app-9a0b9e1..b37e.js gzip 1.28 kB 1.28 kB ✓
_error-ed1b0..8fbd.js gzip 3.44 kB 3.44 kB ✓
hooks-89731c..c609.js gzip 887 B 887 B ✓
index-17468f..5d83.js gzip 227 B 227 B ✓
link-89ad9e7..25bb.js gzip 1.34 kB 1.34 kB ✓
routerDirect..924c.js gzip 284 B 284 B ✓
withRouter-7..c13d.js gzip 284 B 284 B ✓
Overall change 7.74 kB 7.74 kB ✓
Client Pages Modern
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
_app-75d3a82..dule.js gzip 625 B 625 B ✓
_error-4469a..dule.js gzip 2.29 kB 2.29 kB ✓
hooks-cbf13f..dule.js gzip 387 B 387 B ✓
index-b9a643..dule.js gzip 226 B 226 B ✓
link-aeb707b..dule.js gzip 1.29 kB 1.29 kB ✓
routerDirect..dule.js gzip 284 B 284 B ✓
withRouter-f..dule.js gzip 282 B 282 B ✓
Overall change 5.39 kB 5.39 kB ✓
Client Build Manifests
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
_buildManifest.js gzip 322 B 322 B ✓
_buildManife..dule.js gzip 329 B 329 B ✓
Overall change 651 B 651 B ✓
Serverless bundles
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
_error.js 1.06 MB 1.06 MB ✓
404.html 4.34 kB 4.34 kB ✓
hooks.html 3.92 kB 3.92 kB ✓
index.js 1.06 MB 1.06 MB ✓
link.js 1.1 MB 1.1 MB ✓
routerDirect.js 1.1 MB 1.1 MB ✓
withRouter.js 1.1 MB 1.1 MB ✓
Overall change 5.42 MB 5.42 MB ✓
Commit: 1204206

@ijjk
Copy link
Member

ijjk commented Oct 16, 2020

Failing test suites

Commit: 1204206

test/integration/build-output/test/index.test.js

  • Build Output > Basic Application Output > should not deviate from snapshot
Expand output

● Build Output › Basic Application Output › should not deviate from snapshot

expect(received).toBeLessThanOrEqual(expected)

Expected: <= 0
Received:    0.09999999999999432

  105 |       expect(err404FirstLoad.endsWith('kB')).toBe(true)
  106 | 
> 107 |       expect(parseFloat(sharedByAll) - 60.7).toBeLessThanOrEqual(0)
      |                                              ^
  108 |       expect(sharedByAll.endsWith('kB')).toBe(true)
  109 | 
  110 |       if (_appSize.endsWith('kB')) {

  at Object.<anonymous> (integration/build-output/test/index.test.js:107:46)

ijjk
ijjk previously approved these changes Oct 16, 2020
View reviewed changes
@Timer Timer requested a review from ijjk October 16, 2020 08:06
@ijjk
Copy link
Member

ijjk commented Oct 16, 2020

Stats from current PR

Default Server Mode (Increase detected ⚠️)
General Overall increase ⚠️
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
buildDuration 13.5s 12.9s -629ms
nodeModulesSize 64.3 MB 64.3 MB ⚠️ +1.16 kB
Page Load Tests Overall decrease ⚠️
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
/ failed reqs 0 0 ✓
/ total time (seconds) 2.447 2.492 ⚠️ +0.04
/ avg req/sec 1021.83 1003.36 ⚠️ -18.47
/error-in-render failed reqs 0 0 ✓
/error-in-render total time (seconds) 1.342 1.356 ⚠️ +0.01
/error-in-render avg req/sec 1862.39 1844.32 ⚠️ -18.07
Client Bundles (main, webpack, commons) Overall increase ⚠️
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
677f882d2ed8..7765.js gzip 11.1 kB 11.1 kB ✓
framework.HASH.js gzip 39 kB 39 kB ✓
main-43e96dd..7c44.js gzip 7.3 kB 7.33 kB ⚠️ +28 B
webpack-e067..f178.js gzip 751 B 751 B ✓
Overall change 58.1 kB 58.1 kB ⚠️ +28 B
Client Bundles (main, webpack, commons) Modern Overall increase ⚠️
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
677f882d2ed8..dule.js gzip 6.94 kB 6.94 kB ✓
framework.HA..dule.js gzip 39 kB 39 kB ✓
main-ee66c17..dule.js gzip 6.29 kB 6.32 kB ⚠️ +22 B
webpack-07c5..dule.js gzip 751 B 751 B ✓
Overall change 53 kB 53 kB ⚠️ +22 B
Legacy Client Bundles (polyfills)
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
polyfills-4b..e242.js gzip 31 kB 31 kB ✓
Overall change 31 kB 31 kB ✓
Client Pages
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
_app-9a0b9e1..b37e.js gzip 1.28 kB 1.28 kB ✓
_error-ed1b0..8fbd.js gzip 3.44 kB 3.44 kB ✓
hooks-89731c..c609.js gzip 887 B 887 B ✓
index-17468f..5d83.js gzip 227 B 227 B ✓
link-89ad9e7..25bb.js gzip 1.34 kB 1.34 kB ✓
routerDirect..924c.js gzip 284 B 284 B ✓
withRouter-7..c13d.js gzip 284 B 284 B ✓
Overall change 7.74 kB 7.74 kB ✓
Client Pages Modern
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
_app-75d3a82..dule.js gzip 625 B 625 B ✓
_error-4469a..dule.js gzip 2.29 kB 2.29 kB ✓
hooks-cbf13f..dule.js gzip 387 B 387 B ✓
index-b9a643..dule.js gzip 226 B 226 B ✓
link-aeb707b..dule.js gzip 1.29 kB 1.29 kB ✓
routerDirect..dule.js gzip 284 B 284 B ✓
withRouter-f..dule.js gzip 282 B 282 B ✓
Overall change 5.39 kB 5.39 kB ✓
Client Build Manifests
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
_buildManifest.js gzip 322 B 322 B ✓
_buildManife..dule.js gzip 329 B 329 B ✓
Overall change 651 B 651 B ✓
Rendered Page Sizes Overall decrease ✓
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
index.html gzip 1 kB 1 kB -1 B
link.html gzip 1.01 kB 1.01 kB -1 B
withRouter.html gzip 995 B 996 B ⚠️ +1 B
Overall change 3.01 kB 3.01 kB -1 B

Diffs

Diff for main-32c48d3..47fa3ff41.js 
@@ -857,10 +857,6 @@ _N_E = (window["webpackJsonp_N_E"] = window["webpackJsonp_N_E"] || []).push([
             _reactDom["default"].hydrate(reactEl, domEl, markHydrateComplete);
 
             isInitialRender = false;
-
-            if (onPerfEntry && _utils.ST) {
-              (0, _performanceRelayer["default"])(onPerfEntry);
-            }
           } else {
             _reactDom["default"].render(reactEl, domEl, markRenderComplete);
           }
@@ -1157,7 +1153,12 @@ _N_E = (window["webpackJsonp_N_E"] = window["webpackJsonp_N_E"] || []).push([
               window.__NEXT_HYDRATED_CB();
             }
           }, []);
-        }
+        } // We should ask to measure the Web Vitals after rendering completes so we
+        // don't cause any hydration delay:
+
+        _react["default"].useEffect(function() {
+          (0, _performanceRelayer["default"])(onPerfEntry);
+        }, []);
 
         return children;
       }
@@ -1249,12 +1250,29 @@ _N_E = (window["webpackJsonp_N_E"] = window["webpackJsonp_N_E"] || []).push([
 
       var _webVitals = __webpack_require__("w6Sm");
 
+      var isRegistered = false;
+      var userReportHandler;
+
+      function onReport(metric) {
+        if (userReportHandler) {
+          userReportHandler(metric);
+        }
+      }
+
       var _default = function _default(onPerfEntry) {
-        (0, _webVitals.getCLS)(onPerfEntry);
-        (0, _webVitals.getFID)(onPerfEntry);
-        (0, _webVitals.getFCP)(onPerfEntry);
-        (0, _webVitals.getLCP)(onPerfEntry);
-        (0, _webVitals.getTTFB)(onPerfEntry);
+        // Update function if it changes:
+        userReportHandler = onPerfEntry; // Only register listeners once:
+
+        if (isRegistered) {
+          return;
+        }
+
+        isRegistered = true;
+        (0, _webVitals.getCLS)(onReport);
+        (0, _webVitals.getFID)(onReport);
+        (0, _webVitals.getFCP)(onReport);
+        (0, _webVitals.getLCP)(onReport);
+        (0, _webVitals.getTTFB)(onReport);
       };
 
       exports["default"] = _default;
Diff for main-f1e531e..6f.module.js 
@@ -602,10 +602,6 @@
             _reactDom.default.hydrate(reactEl, domEl, markHydrateComplete);
 
             isInitialRender = false;
-
-            if (onPerfEntry && _utils.ST) {
-              (0, _performanceRelayer.default)(onPerfEntry);
-            }
           } else {
             _reactDom.default.render(reactEl, domEl, markRenderComplete);
           }
@@ -879,7 +875,12 @@
               window.__NEXT_HYDRATED_CB();
             }
           }, []);
-        }
+        } // We should ask to measure the Web Vitals after rendering completes so we
+        // don't cause any hydration delay:
+
+        _react.default.useEffect(() => {
+          (0, _performanceRelayer.default)(onPerfEntry);
+        }, []);
 
         return children;
       }
@@ -919,12 +920,29 @@
 
       var _webVitals = __webpack_require__("w6Sm");
 
+      var isRegistered = false;
+      var userReportHandler;
+
+      function onReport(metric) {
+        if (userReportHandler) {
+          userReportHandler(metric);
+        }
+      }
+
       var _default = onPerfEntry => {
-        (0, _webVitals.getCLS)(onPerfEntry);
-        (0, _webVitals.getFID)(onPerfEntry);
-        (0, _webVitals.getFCP)(onPerfEntry);
-        (0, _webVitals.getLCP)(onPerfEntry);
-        (0, _webVitals.getTTFB)(onPerfEntry);
+        // Update function if it changes:
+        userReportHandler = onPerfEntry; // Only register listeners once:
+
+        if (isRegistered) {
+          return;
+        }
+
+        isRegistered = true;
+        (0, _webVitals.getCLS)(onReport);
+        (0, _webVitals.getFID)(onReport);
+        (0, _webVitals.getFCP)(onReport);
+        (0, _webVitals.getLCP)(onReport);
+        (0, _webVitals.getTTFB)(onReport);
       };
 
       exports.default = _default;
Diff for index.html 
@@ -6,7 +6,7 @@
     <noscript data-n-css="true"></noscript>
     <link
       rel="preload"
-      href="/_next/static/chunks/main-f1e531e41c50db5e466f.module.js"
+      href="/_next/static/chunks/main-1a272751c87e3e75cfce.module.js"
       as="script"
       crossorigin="anonymous"
     />
@@ -85,13 +85,13 @@
       src="/_next/static/chunks/polyfills-f73ba3fc145972ef83e9.js"
     ></script>
     <script
-      src="/_next/static/chunks/main-32c48d3fa8f47fa3ff41.js"
+      src="/_next/static/chunks/main-02ee662035354b1db7eb.js"
       async=""
       crossorigin="anonymous"
       nomodule=""
     ></script>
     <script
-      src="/_next/static/chunks/main-f1e531e41c50db5e466f.module.js"
+      src="/_next/static/chunks/main-1a272751c87e3e75cfce.module.js"
       async=""
       crossorigin="anonymous"
       type="module"
Diff for link.html 
@@ -6,7 +6,7 @@
     <noscript data-n-css="true"></noscript>
     <link
       rel="preload"
-      href="/_next/static/chunks/main-f1e531e41c50db5e466f.module.js"
+      href="/_next/static/chunks/main-1a272751c87e3e75cfce.module.js"
       as="script"
       crossorigin="anonymous"
     />
@@ -90,13 +90,13 @@
       src="/_next/static/chunks/polyfills-f73ba3fc145972ef83e9.js"
     ></script>
     <script
-      src="/_next/static/chunks/main-32c48d3fa8f47fa3ff41.js"
+      src="/_next/static/chunks/main-02ee662035354b1db7eb.js"
       async=""
       crossorigin="anonymous"
       nomodule=""
     ></script>
     <script
-      src="/_next/static/chunks/main-f1e531e41c50db5e466f.module.js"
+      src="/_next/static/chunks/main-1a272751c87e3e75cfce.module.js"
       async=""
       crossorigin="anonymous"
       type="module"
Diff for withRouter.html 
@@ -6,7 +6,7 @@
     <noscript data-n-css="true"></noscript>
     <link
       rel="preload"
-      href="/_next/static/chunks/main-f1e531e41c50db5e466f.module.js"
+      href="/_next/static/chunks/main-1a272751c87e3e75cfce.module.js"
       as="script"
       crossorigin="anonymous"
     />
@@ -85,13 +85,13 @@
       src="/_next/static/chunks/polyfills-f73ba3fc145972ef83e9.js"
     ></script>
     <script
-      src="/_next/static/chunks/main-32c48d3fa8f47fa3ff41.js"
+      src="/_next/static/chunks/main-02ee662035354b1db7eb.js"
       async=""
       crossorigin="anonymous"
       nomodule=""
     ></script>
     <script
-      src="/_next/static/chunks/main-f1e531e41c50db5e466f.module.js"
+      src="/_next/static/chunks/main-1a272751c87e3e75cfce.module.js"
       async=""
       crossorigin="anonymous"
       type="module"
Serverless Mode (Increase detected ⚠️)
General Overall increase ⚠️
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
buildDuration 15.1s 15.3s ⚠️ +198ms
nodeModulesSize 64.3 MB 64.3 MB ⚠️ +1.16 kB
Client Bundles (main, webpack, commons) Overall increase ⚠️
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
677f882d2ed8..7765.js gzip 11.1 kB 11.1 kB ✓
framework.HASH.js gzip 39 kB 39 kB ✓
main-43e96dd..7c44.js gzip 7.3 kB N/A N/A
webpack-e067..f178.js gzip 751 B 751 B ✓
main-1e58cc5..96bb.js gzip N/A 7.33 kB N/A
Overall change 58.1 kB 58.1 kB ⚠️ +28 B
Client Bundles (main, webpack, commons) Modern Overall increase ⚠️
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
677f882d2ed8..dule.js gzip 6.94 kB 6.94 kB ✓
framework.HA..dule.js gzip 39 kB 39 kB ✓
main-ee66c17..dule.js gzip 6.29 kB N/A N/A
webpack-07c5..dule.js gzip 751 B 751 B ✓
main-1eeec67..dule.js gzip N/A 6.32 kB N/A
Overall change 53 kB 53 kB ⚠️ +22 B
Legacy Client Bundles (polyfills)
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
polyfills-4b..e242.js gzip 31 kB 31 kB ✓
Overall change 31 kB 31 kB ✓
Client Pages
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
_app-9a0b9e1..b37e.js gzip 1.28 kB 1.28 kB ✓
_error-ed1b0..8fbd.js gzip 3.44 kB 3.44 kB ✓
hooks-89731c..c609.js gzip 887 B 887 B ✓
index-17468f..5d83.js gzip 227 B 227 B ✓
link-89ad9e7..25bb.js gzip 1.34 kB 1.34 kB ✓
routerDirect..924c.js gzip 284 B 284 B ✓
withRouter-7..c13d.js gzip 284 B 284 B ✓
Overall change 7.74 kB 7.74 kB ✓
Client Pages Modern
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
_app-75d3a82..dule.js gzip 625 B 625 B ✓
_error-4469a..dule.js gzip 2.29 kB 2.29 kB ✓
hooks-cbf13f..dule.js gzip 387 B 387 B ✓
index-b9a643..dule.js gzip 226 B 226 B ✓
link-aeb707b..dule.js gzip 1.29 kB 1.29 kB ✓
routerDirect..dule.js gzip 284 B 284 B ✓
withRouter-f..dule.js gzip 282 B 282 B ✓
Overall change 5.39 kB 5.39 kB ✓
Client Build Manifests
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
_buildManifest.js gzip 322 B 322 B ✓
_buildManife..dule.js gzip 329 B 329 B ✓
Overall change 651 B 651 B ✓
Serverless bundles
vercel/next.js canary Timer/next.js hotfix/fix-web-vitals Change
_error.js 1.06 MB 1.06 MB ✓
404.html 4.34 kB 4.34 kB ✓
hooks.html 3.92 kB 3.92 kB ✓
index.js 1.06 MB 1.06 MB ✓
link.js 1.1 MB 1.1 MB ✓
routerDirect.js 1.1 MB 1.1 MB ✓
withRouter.js 1.1 MB 1.1 MB ✓
Overall change 5.42 MB 5.42 MB ✓
Commit: 2a7837a

@kodiakhq kodiakhq bot merged commit 75f75f3 into vercel:canary Oct 16, 2020
@ijjk ijjk deleted the hotfix/fix-web-vitals branch October 16, 2020 08:36
@vercel vercel locked as resolved and limited conversation to collaborators Jan 29, 2022
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Reviewers

@ijjk ijjk ijjk approved these changes

@lfades lfades Awaiting requested review from lfades

@timneutkens timneutkens Awaiting requested review from timneutkens timneutkens is a code owner

Assignees
No one assigned
Labels
type: next
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

None yet
2 participants
@Timer @ijjk