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.

Sign up for GitHub

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

Revert "Add scroll restoration handling after render is done" #14075

Merged
merged 2 commits into from
Jun 11, 2020
Merged

Revert "Add scroll restoration handling after render is done" #14075

merged 2 commits into from
Jun 11, 2020
+0 −185

Conversation

Timer
Copy link
Member

@Timer Timer commented Jun 11, 2020

Reverts #13914

Reopens #12530

timneutkens
timneutkens previously approved these changes Jun 11, 2020
View reviewed changes
@ijjk
Copy link
Member

ijjk commented Jun 11, 2020

Stats from current PR

Default Server Mode (Increase detected ⚠️)
General Overall decrease ✓
vercel/next.js canary vercel/next.js revert-13914-add/scroll-restoration Change
buildDuration 16.7s 16.6s -78ms
nodeModulesSize 64.9 MB 64.9 MB -2.2 kB
Page Load Tests Overall increase ✓
vercel/next.js canary vercel/next.js revert-13914-add/scroll-restoration Change
/ failed reqs 0 0 ✓
/ total time (seconds) 3.004 2.902 -0.1
/ avg req/sec 832.14 861.53 ⚠️ +29.39
/error-in-render failed reqs 0 0 ✓
/error-in-render total time (seconds) 2.138 1.994 -0.14
/error-in-render avg req/sec 1169.54 1253.84 ⚠️ +84.3
Client Bundles (main, webpack, commons) Overall decrease ✓
vercel/next.js canary vercel/next.js revert-13914-add/scroll-restoration Change
main-HASH.js gzip 6.49 kB 6.49 kB ✓
webpack-HASH.js gzip 746 B 746 B ✓
de003c3a9d30..f367.js gzip 10.9 kB 10.5 kB -322 B
framework.HASH.js gzip 39.1 kB 39.1 kB ✓
Overall change 57.2 kB 56.9 kB -322 B
Client Bundles (main, webpack, commons) Modern Overall decrease ✓
vercel/next.js canary vercel/next.js revert-13914-add/scroll-restoration Change
main-HASH.module.js gzip 5.58 kB 5.58 kB ✓
webpack-HASH..dule.js gzip 746 B 746 B ✓
de003c3a9d30..dule.js gzip 7.27 kB 6.93 kB -338 B
framework.HA..dule.js gzip 39.1 kB 39.1 kB ✓
Overall change 52.7 kB 52.4 kB -338 B
Legacy Client Bundles (polyfills)
vercel/next.js canary vercel/next.js revert-13914-add/scroll-restoration Change
polyfills-HASH.js gzip 26.3 kB 26.3 kB ✓
Overall change 26.3 kB 26.3 kB ✓
Client Pages
vercel/next.js canary vercel/next.js revert-13914-add/scroll-restoration Change
routerDirect.js gzip 279 B 279 B ✓
withRouter.js gzip 278 B 278 B ✓
index.js gzip 222 B 222 B ✓
link.js gzip 2.05 kB 2.05 kB ✓
hooks.js gzip 881 B 881 B ✓
_app.js gzip 1.26 kB 1.26 kB ✓
_error.js gzip 3.25 kB 3.25 kB ✓
Overall change 8.22 kB 8.22 kB ✓
Client Pages Modern
vercel/next.js canary vercel/next.js revert-13914-add/scroll-restoration Change
index.module.js gzip 223 B 223 B ✓
routerDirect..dule.js gzip 281 B 281 B ✓
withRouter.m..dule.js gzip 278 B 278 B ✓
_error.module.js gzip 2.04 kB 2.04 kB ✓
hooks.module.js gzip 383 B 383 B ✓
link.module.js gzip 1.52 kB 1.52 kB ✓
_app.module.js gzip 604 B 604 B ✓
Overall change 5.33 kB 5.33 kB ✓
Client Build Manifests
vercel/next.js canary vercel/next.js revert-13914-add/scroll-restoration Change
_buildManifest.js gzip 270 B 270 B ✓
_buildManife..dule.js gzip 275 B 275 B ✓
Overall change 545 B 545 B ✓
Rendered Page Sizes Overall decrease ✓
vercel/next.js canary vercel/next.js revert-13914-add/scroll-restoration Change
index.html gzip 955 B 953 B -2 B
link.html gzip 961 B 960 B -1 B
withRouter.html gzip 948 B 946 B -2 B
Overall change 2.86 kB 2.86 kB -5 B

Diffs

Diff for de003c3a9d30..83.module.js 
@@ -583,46 +583,6 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
     /***/ elyg: /***/ function(module, exports, __webpack_require__) {
       "use strict";
 
-      var _defineProperty = __webpack_require__("lSNA");
-
-      function ownKeys(object, enumerableOnly) {
-        var keys = Object.keys(object);
-        if (Object.getOwnPropertySymbols) {
-          var symbols = Object.getOwnPropertySymbols(object);
-          if (enumerableOnly)
-            symbols = symbols.filter(function(sym) {
-              return Object.getOwnPropertyDescriptor(object, sym).enumerable;
-            });
-          keys.push.apply(keys, symbols);
-        }
-        return keys;
-      }
-
-      function _objectSpread(target) {
-        for (var i = 1; i < arguments.length; i++) {
-          var source = arguments[i] != null ? arguments[i] : {};
-          if (i % 2) {
-            ownKeys(Object(source), true).forEach(function(key) {
-              _defineProperty(target, key, source[key]);
-            });
-          } else if (Object.getOwnPropertyDescriptors) {
-            Object.defineProperties(
-              target,
-              Object.getOwnPropertyDescriptors(source)
-            );
-          } else {
-            ownKeys(Object(source)).forEach(function(key) {
-              Object.defineProperty(
-                target,
-                key,
-                Object.getOwnPropertyDescriptor(source, key)
-              );
-            });
-          }
-        }
-        return target;
-      }
-
       exports.__esModule = true;
       exports.addBasePath = addBasePath;
       exports.delBasePath = delBasePath;
@@ -681,9 +641,6 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
         };
       }
 
-      var manualScrollRestoration =
-        true && "scrollRestoration" in window.history;
-
       function fetchNextData(pathname, query, isServerRender, cb) {
         var attempts = isServerRender ? 3 : 1;
 
@@ -894,12 +851,7 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
               );
             }
 
-            window.addEventListener("popstate", this.onPopState); // enable custom scroll restoration handling when available
-            // otherwise fallback to browser's default handling
-
-            if (manualScrollRestoration) {
-              window.history.scrollRestoration = "manual";
-            }
+            window.addEventListener("popstate", this.onPopState);
           }
         } // @deprecated backwards compatibility even though it's a private method.
 
@@ -1084,28 +1036,6 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
                 }
 
                 Router.events.emit("beforeHistoryChange", as);
-
-                if (manualScrollRestoration && history.state) {
-                  var {
-                    url: curUrl,
-                    as: curAs,
-                    options: curOptions
-                  } = history.state;
-                  this.changeState(
-                    "replaceState",
-                    curUrl,
-                    curAs,
-                    _objectSpread(
-                      _objectSpread({}, curOptions),
-                      {},
-                      {
-                        _N_X: window.scrollX,
-                        _N_Y: window.scrollY
-                      }
-                    )
-                  );
-                }
-
                 this.changeState(method, url, as, options);
 
                 if (false) {
@@ -1119,11 +1049,6 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
                   }
 
                   Router.events.emit("routeChangeComplete", as);
-
-                  if (manualScrollRestoration && "_N_X" in options) {
-                    window.scrollTo(options._N_X, options._N_Y);
-                  }
-
                   return resolve(true);
                 });
               },
@@ -1722,27 +1647,6 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
       /***/
     },
 
-    /***/ lSNA: /***/ function(module, exports) {
-      function _defineProperty(obj, key, value) {
-        if (key in obj) {
-          Object.defineProperty(obj, key, {
-            value: value,
-            enumerable: true,
-            configurable: true,
-            writable: true
-          });
-        } else {
-          obj[key] = value;
-        }
-
-        return obj;
-      }
-
-      module.exports = _defineProperty;
-
-      /***/
-    },
-
     /***/ nOHt: /***/ function(module, exports, __webpack_require__) {
       "use strict";
Diff for de003c3a9d30..1e94a881a.js 
@@ -707,50 +707,10 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
 
       var _slicedToArray = __webpack_require__("J4zp");
 
-      var _defineProperty = __webpack_require__("lSNA");
-
       var _classCallCheck = __webpack_require__("lwsE");
 
       var _createClass = __webpack_require__("W8MJ");
 
-      function ownKeys(object, enumerableOnly) {
-        var keys = Object.keys(object);
-        if (Object.getOwnPropertySymbols) {
-          var symbols = Object.getOwnPropertySymbols(object);
-          if (enumerableOnly)
-            symbols = symbols.filter(function(sym) {
-              return Object.getOwnPropertyDescriptor(object, sym).enumerable;
-            });
-          keys.push.apply(keys, symbols);
-        }
-        return keys;
-      }
-
-      function _objectSpread(target) {
-        for (var i = 1; i < arguments.length; i++) {
-          var source = arguments[i] != null ? arguments[i] : {};
-          if (i % 2) {
-            ownKeys(Object(source), true).forEach(function(key) {
-              _defineProperty(target, key, source[key]);
-            });
-          } else if (Object.getOwnPropertyDescriptors) {
-            Object.defineProperties(
-              target,
-              Object.getOwnPropertyDescriptors(source)
-            );
-          } else {
-            ownKeys(Object(source)).forEach(function(key) {
-              Object.defineProperty(
-                target,
-                key,
-                Object.getOwnPropertyDescriptor(source, key)
-              );
-            });
-          }
-        }
-        return target;
-      }
-
       exports.__esModule = true;
       exports.addBasePath = addBasePath;
       exports.delBasePath = delBasePath;
@@ -810,9 +770,6 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
         };
       }
 
-      var manualScrollRestoration =
-        true && "scrollRestoration" in window.history;
-
       function fetchNextData(pathname, query, isServerRender, cb) {
         var attempts = isServerRender ? 3 : 1;
 
@@ -1032,12 +989,7 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
               );
             }
 
-            window.addEventListener("popstate", this.onPopState); // enable custom scroll restoration handling when available
-            // otherwise fallback to browser's default handling
-
-            if (manualScrollRestoration) {
-              window.history.scrollRestoration = "manual";
-            }
+            window.addEventListener("popstate", this.onPopState);
           }
         } // @deprecated backwards compatibility even though it's a private method.
 
@@ -1253,27 +1205,6 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
 
                       Router.events.emit("beforeHistoryChange", as);
 
-                      if (manualScrollRestoration && history.state) {
-                        var _history$state = history.state,
-                          curUrl = _history$state.url,
-                          curAs = _history$state.as,
-                          curOptions = _history$state.options;
-
-                        _this2.changeState(
-                          "replaceState",
-                          curUrl,
-                          curAs,
-                          _objectSpread(
-                            _objectSpread({}, curOptions),
-                            {},
-                            {
-                              _N_X: window.scrollX,
-                              _N_Y: window.scrollY
-                            }
-                          )
-                        );
-                      }
-
                       _this2.changeState(method, url, as, options);
 
                       if (false) {
@@ -1289,11 +1220,6 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
                           }
 
                           Router.events.emit("routeChangeComplete", as);
-
-                          if (manualScrollRestoration && "_N_X" in options) {
-                            window.scrollTo(options._N_X, options._N_Y);
-                          }
-
                           return resolve(true);
                         });
                     }, reject);
@@ -2079,27 +2005,6 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
       /***/
     },
 
-    /***/ lSNA: /***/ function(module, exports) {
-      function _defineProperty(obj, key, value) {
-        if (key in obj) {
-          Object.defineProperty(obj, key, {
-            value: value,
-            enumerable: true,
-            configurable: true,
-            writable: true
-          });
-        } else {
-          obj[key] = value;
-        }
-
-        return obj;
-      }
-
-      module.exports = _defineProperty;
-
-      /***/
-    },
-
     /***/ ls82: /***/ function(module, exports, __webpack_require__) {
       /**
        * Copyright (c) 2014-present, Facebook, Inc.
Diff for index.html 
@@ -24,7 +24,7 @@
     />
     <link
       rel="preload"
-      href="/_next/static/chunks/de003c3a9d308750aa009870a5926f9b18ab31f4.5432a710f5f6d1c3d083.module.js"
+      href="/_next/static/chunks/de003c3a9d308750aa009870a5926f9b18ab31f4.ed607369b02fc3d1fc16.module.js"
       as="script"
       crossorigin="anonymous"
     />
@@ -117,13 +117,13 @@
       type="module"
     ></script>
     <script
-      src="/_next/static/chunks/de003c3a9d308750aa009870a5926f9b18ab31f4.7c1823be9c21e94a881a.js"
+      src="/_next/static/chunks/de003c3a9d308750aa009870a5926f9b18ab31f4.6cc2c580adc8ea07fa97.js"
       async=""
       crossorigin="anonymous"
       nomodule=""
     ></script>
     <script
-      src="/_next/static/chunks/de003c3a9d308750aa009870a5926f9b18ab31f4.5432a710f5f6d1c3d083.module.js"
+      src="/_next/static/chunks/de003c3a9d308750aa009870a5926f9b18ab31f4.ed607369b02fc3d1fc16.module.js"
       async=""
       crossorigin="anonymous"
       type="module"
Diff for link.html 
@@ -24,7 +24,7 @@
     />
     <link
       rel="preload"
-      href="/_next/static/chunks/de003c3a9d308750aa009870a5926f9b18ab31f4.5432a710f5f6d1c3d083.module.js"
+      href="/_next/static/chunks/de003c3a9d308750aa009870a5926f9b18ab31f4.ed607369b02fc3d1fc16.module.js"
       as="script"
       crossorigin="anonymous"
     />
@@ -122,13 +122,13 @@
       type="module"
     ></script>
     <script
-      src="/_next/static/chunks/de003c3a9d308750aa009870a5926f9b18ab31f4.7c1823be9c21e94a881a.js"
+      src="/_next/static/chunks/de003c3a9d308750aa009870a5926f9b18ab31f4.6cc2c580adc8ea07fa97.js"
       async=""
       crossorigin="anonymous"
       nomodule=""
     ></script>
     <script
-      src="/_next/static/chunks/de003c3a9d308750aa009870a5926f9b18ab31f4.5432a710f5f6d1c3d083.module.js"
+      src="/_next/static/chunks/de003c3a9d308750aa009870a5926f9b18ab31f4.ed607369b02fc3d1fc16.module.js"
       async=""
       crossorigin="anonymous"
       type="module"
Diff for withRouter.html 
@@ -24,7 +24,7 @@
     />
     <link
       rel="preload"
-      href="/_next/static/chunks/de003c3a9d308750aa009870a5926f9b18ab31f4.5432a710f5f6d1c3d083.module.js"
+      href="/_next/static/chunks/de003c3a9d308750aa009870a5926f9b18ab31f4.ed607369b02fc3d1fc16.module.js"
       as="script"
       crossorigin="anonymous"
     />
@@ -117,13 +117,13 @@
       type="module"
     ></script>
     <script
-      src="/_next/static/chunks/de003c3a9d308750aa009870a5926f9b18ab31f4.7c1823be9c21e94a881a.js"
+      src="/_next/static/chunks/de003c3a9d308750aa009870a5926f9b18ab31f4.6cc2c580adc8ea07fa97.js"
       async=""
       crossorigin="anonymous"
       nomodule=""
     ></script>
     <script
-      src="/_next/static/chunks/de003c3a9d308750aa009870a5926f9b18ab31f4.5432a710f5f6d1c3d083.module.js"
+      src="/_next/static/chunks/de003c3a9d308750aa009870a5926f9b18ab31f4.ed607369b02fc3d1fc16.module.js"
       async=""
       crossorigin="anonymous"
       type="module"
Serverless Mode (Decrease detected ✓)
General Overall decrease ✓
vercel/next.js canary vercel/next.js revert-13914-add/scroll-restoration Change
buildDuration 14.5s 14.9s ⚠️ +412ms
nodeModulesSize 64.9 MB 64.9 MB -2.2 kB
Client Bundles (main, webpack, commons) Overall decrease ✓
vercel/next.js canary vercel/next.js revert-13914-add/scroll-restoration Change
main-HASH.js gzip 6.49 kB 6.49 kB ✓
webpack-HASH.js gzip 746 B 746 B ✓
de003c3a9d30..f367.js gzip 10.9 kB N/A N/A
framework.HASH.js gzip 39.1 kB 39.1 kB ✓
de003c3a9d30..8203.js gzip N/A 10.5 kB N/A
Overall change 57.2 kB 56.9 kB -322 B
Client Bundles (main, webpack, commons) Modern Overall decrease ✓
vercel/next.js canary vercel/next.js revert-13914-add/scroll-restoration Change
main-HASH.module.js gzip 5.58 kB 5.58 kB ✓
webpack-HASH..dule.js gzip 746 B 746 B ✓
de003c3a9d30..dule.js gzip 7.27 kB N/A N/A
framework.HA..dule.js gzip 39.1 kB 39.1 kB ✓
de003c3a9d30..dule.js gzip N/A 6.93 kB N/A
Overall change 52.7 kB 52.4 kB -338 B
Legacy Client Bundles (polyfills)
vercel/next.js canary vercel/next.js revert-13914-add/scroll-restoration Change
polyfills-HASH.js gzip 26.3 kB 26.3 kB ✓
Overall change 26.3 kB 26.3 kB ✓
Client Pages
vercel/next.js canary vercel/next.js revert-13914-add/scroll-restoration Change
routerDirect.js gzip 279 B 279 B ✓
withRouter.js gzip 278 B 278 B ✓
index.js gzip 222 B 222 B ✓
link.js gzip 2.05 kB 2.05 kB ✓
hooks.js gzip 881 B 881 B ✓
_app.js gzip 1.26 kB 1.26 kB ✓
_error.js gzip 3.25 kB 3.25 kB ✓
Overall change 8.22 kB 8.22 kB ✓
Client Pages Modern
vercel/next.js canary vercel/next.js revert-13914-add/scroll-restoration Change
index.module.js gzip 223 B 223 B ✓
routerDirect..dule.js gzip 281 B 281 B ✓
withRouter.m..dule.js gzip 278 B 278 B ✓
_error.module.js gzip 2.04 kB 2.04 kB ✓
hooks.module.js gzip 383 B 383 B ✓
link.module.js gzip 1.52 kB 1.52 kB ✓
_app.module.js gzip 604 B 604 B ✓
Overall change 5.33 kB 5.33 kB ✓
Client Build Manifests
vercel/next.js canary vercel/next.js revert-13914-add/scroll-restoration Change
_buildManifest.js gzip 270 B 270 B ✓
_buildManife..dule.js gzip 275 B 275 B ✓
Overall change 545 B 545 B ✓
Serverless bundles Overall decrease ✓
vercel/next.js canary vercel/next.js revert-13914-add/scroll-restoration Change
_error.js 875 kB 875 kB ✓
404.html 4.17 kB 4.17 kB ✓
hooks.html 3.79 kB 3.79 kB ✓
index.js 875 kB 875 kB ✓
link.js 915 kB 913 kB -1.66 kB
routerDirect.js 907 kB 905 kB -1.66 kB
withRouter.js 907 kB 905 kB -1.66 kB
Overall change 4.49 MB 4.48 MB -4.98 kB

ijjk
ijjk previously approved these changes Jun 11, 2020
View reviewed changes
@ijjk ijjk mentioned this pull request Jun 11, 2020
Merged
@Timer Timer dismissed stale reviews from ijjk and timneutkens via 7d243f4 June 11, 2020 14:20
@Timer Timer requested a review from ijjk June 11, 2020 14:21
@ijjk
Copy link
Member

ijjk commented Jun 11, 2020

Stats from current PR

Default Server Mode (Increase detected ⚠️)
General Overall decrease ✓
vercel/next.js canary vercel/next.js revert-13914-add/scroll-restoration Change
buildDuration 13s 13s ⚠️ +8ms
nodeModulesSize 64.9 MB 64.9 MB -2.21 kB
Page Load Tests Overall increase ✓
vercel/next.js canary vercel/next.js revert-13914-add/scroll-restoration Change
/ failed reqs 0 0 ✓
/ total time (seconds) 2.264 2.278 ⚠️ +0.01
/ avg req/sec 1104.43 1097.54 -6.89
/error-in-render failed reqs 0 0 ✓
/error-in-render total time (seconds) 1.459 1.449 -0.01
/error-in-render avg req/sec 1713.66 1725.76 ⚠️ +12.1
Client Bundles (main, webpack, commons) Overall decrease ✓
vercel/next.js canary vercel/next.js revert-13914-add/scroll-restoration Change
main-HASH.js gzip 6.49 kB 6.49 kB ✓
webpack-HASH.js gzip 746 B 746 B ✓
de003c3a9d30..3ed8.js gzip 10.9 kB 10.5 kB -320 B
framework.HASH.js gzip 39.1 kB 39.1 kB ✓
Overall change 57.3 kB 56.9 kB -320 B
Client Bundles (main, webpack, commons) Modern Overall decrease ✓
vercel/next.js canary vercel/next.js revert-13914-add/scroll-restoration Change
main-HASH.module.js gzip 5.58 kB 5.58 kB ✓
webpack-HASH..dule.js gzip 746 B 746 B ✓
de003c3a9d30..dule.js gzip 7.27 kB 6.93 kB -342 B
framework.HA..dule.js gzip 39.1 kB 39.1 kB ✓
Overall change 52.7 kB 52.4 kB -342 B
Legacy Client Bundles (polyfills)
vercel/next.js canary vercel/next.js revert-13914-add/scroll-restoration Change
polyfills-HASH.js gzip 26.3 kB 26.3 kB ✓
Overall change 26.3 kB 26.3 kB ✓
Client Pages
vercel/next.js canary vercel/next.js revert-13914-add/scroll-restoration Change
routerDirect.js gzip 279 B 279 B ✓
withRouter.js gzip 278 B 278 B ✓
index.js gzip 222 B 222 B ✓
link.js gzip 2.05 kB 2.05 kB ✓
hooks.js gzip 881 B 881 B ✓
_app.js gzip 1.26 kB 1.26 kB ✓
_error.js gzip 3.25 kB 3.25 kB ✓
Overall change 8.22 kB 8.22 kB ✓
Client Pages Modern
vercel/next.js canary vercel/next.js revert-13914-add/scroll-restoration Change
index.module.js gzip 223 B 223 B ✓
routerDirect..dule.js gzip 281 B 281 B ✓
withRouter.m..dule.js gzip 278 B 278 B ✓
_error.module.js gzip 2.04 kB 2.04 kB ✓
hooks.module.js gzip 383 B 383 B ✓
link.module.js gzip 1.52 kB 1.52 kB ✓
_app.module.js gzip 604 B 604 B ✓
Overall change 5.33 kB 5.33 kB ✓
Client Build Manifests
vercel/next.js canary vercel/next.js revert-13914-add/scroll-restoration Change
_buildManifest.js gzip 270 B 270 B ✓
_buildManife..dule.js gzip 275 B 275 B ✓
Overall change 545 B 545 B ✓
Rendered Page Sizes Overall increase ⚠️
vercel/next.js canary vercel/next.js revert-13914-add/scroll-restoration Change
index.html gzip 951 B 955 B ⚠️ +4 B
link.html gzip 958 B 962 B ⚠️ +4 B
withRouter.html gzip 945 B 949 B ⚠️ +4 B
Overall change 2.85 kB 2.87 kB ⚠️ +12 B

Diffs

Diff for de003c3a9d30..0bd36fce8.js 
@@ -707,50 +707,10 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
 
       var _slicedToArray = __webpack_require__("J4zp");
 
-      var _defineProperty = __webpack_require__("lSNA");
-
       var _classCallCheck = __webpack_require__("lwsE");
 
       var _createClass = __webpack_require__("W8MJ");
 
-      function ownKeys(object, enumerableOnly) {
-        var keys = Object.keys(object);
-        if (Object.getOwnPropertySymbols) {
-          var symbols = Object.getOwnPropertySymbols(object);
-          if (enumerableOnly)
-            symbols = symbols.filter(function(sym) {
-              return Object.getOwnPropertyDescriptor(object, sym).enumerable;
-            });
-          keys.push.apply(keys, symbols);
-        }
-        return keys;
-      }
-
-      function _objectSpread(target) {
-        for (var i = 1; i < arguments.length; i++) {
-          var source = arguments[i] != null ? arguments[i] : {};
-          if (i % 2) {
-            ownKeys(Object(source), true).forEach(function(key) {
-              _defineProperty(target, key, source[key]);
-            });
-          } else if (Object.getOwnPropertyDescriptors) {
-            Object.defineProperties(
-              target,
-              Object.getOwnPropertyDescriptors(source)
-            );
-          } else {
-            ownKeys(Object(source)).forEach(function(key) {
-              Object.defineProperty(
-                target,
-                key,
-                Object.getOwnPropertyDescriptor(source, key)
-              );
-            });
-          }
-        }
-        return target;
-      }
-
       exports.__esModule = true;
       exports.addBasePath = addBasePath;
       exports.delBasePath = delBasePath;
@@ -810,9 +770,6 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
         };
       }
 
-      var manualScrollRestoration =
-        true && "scrollRestoration" in window.history;
-
       function fetchNextData(pathname, query, isServerRender, cb) {
         var attempts = isServerRender ? 3 : 1;
 
@@ -1032,12 +989,7 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
               );
             }
 
-            window.addEventListener("popstate", this.onPopState); // enable custom scroll restoration handling when available
-            // otherwise fallback to browser's default handling
-
-            if (manualScrollRestoration) {
-              window.history.scrollRestoration = "manual";
-            }
+            window.addEventListener("popstate", this.onPopState);
           }
         } // @deprecated backwards compatibility even though it's a private method.
 
@@ -1253,27 +1205,6 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
 
                       Router.events.emit("beforeHistoryChange", as);
 
-                      if (manualScrollRestoration && history.state) {
-                        var _history$state = history.state,
-                          curUrl = _history$state.url,
-                          curAs = _history$state.as,
-                          curOptions = _history$state.options;
-
-                        _this2.changeState(
-                          "replaceState",
-                          curUrl,
-                          curAs,
-                          _objectSpread(
-                            _objectSpread({}, curOptions),
-                            {},
-                            {
-                              _N_X: window.scrollX,
-                              _N_Y: window.scrollY
-                            }
-                          )
-                        );
-                      }
-
                       _this2.changeState(method, url, as, options);
 
                       if (false) {
@@ -1289,11 +1220,6 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
                           }
 
                           Router.events.emit("routeChangeComplete", as);
-
-                          if (manualScrollRestoration && "_N_X" in options) {
-                            window.scrollTo(options._N_X, options._N_Y);
-                          }
-
                           return resolve(true);
                         });
                     }, reject);
@@ -2079,27 +2005,6 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
       /***/
     },
 
-    /***/ lSNA: /***/ function(module, exports) {
-      function _defineProperty(obj, key, value) {
-        if (key in obj) {
-          Object.defineProperty(obj, key, {
-            value: value,
-            enumerable: true,
-            configurable: true,
-            writable: true
-          });
-        } else {
-          obj[key] = value;
-        }
-
-        return obj;
-      }
-
-      module.exports = _defineProperty;
-
-      /***/
-    },
-
     /***/ ls82: /***/ function(module, exports, __webpack_require__) {
       /**
        * Copyright (c) 2014-present, Facebook, Inc.
Diff for de003c3a9d30..cc.module.js 
@@ -583,46 +583,6 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
     /***/ elyg: /***/ function(module, exports, __webpack_require__) {
       "use strict";
 
-      var _defineProperty = __webpack_require__("lSNA");
-
-      function ownKeys(object, enumerableOnly) {
-        var keys = Object.keys(object);
-        if (Object.getOwnPropertySymbols) {
-          var symbols = Object.getOwnPropertySymbols(object);
-          if (enumerableOnly)
-            symbols = symbols.filter(function(sym) {
-              return Object.getOwnPropertyDescriptor(object, sym).enumerable;
-            });
-          keys.push.apply(keys, symbols);
-        }
-        return keys;
-      }
-
-      function _objectSpread(target) {
-        for (var i = 1; i < arguments.length; i++) {
-          var source = arguments[i] != null ? arguments[i] : {};
-          if (i % 2) {
-            ownKeys(Object(source), true).forEach(function(key) {
-              _defineProperty(target, key, source[key]);
-            });
-          } else if (Object.getOwnPropertyDescriptors) {
-            Object.defineProperties(
-              target,
-              Object.getOwnPropertyDescriptors(source)
-            );
-          } else {
-            ownKeys(Object(source)).forEach(function(key) {
-              Object.defineProperty(
-                target,
-                key,
-                Object.getOwnPropertyDescriptor(source, key)
-              );
-            });
-          }
-        }
-        return target;
-      }
-
       exports.__esModule = true;
       exports.addBasePath = addBasePath;
       exports.delBasePath = delBasePath;
@@ -681,9 +641,6 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
         };
       }
 
-      var manualScrollRestoration =
-        true && "scrollRestoration" in window.history;
-
       function fetchNextData(pathname, query, isServerRender, cb) {
         var attempts = isServerRender ? 3 : 1;
 
@@ -894,12 +851,7 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
               );
             }
 
-            window.addEventListener("popstate", this.onPopState); // enable custom scroll restoration handling when available
-            // otherwise fallback to browser's default handling
-
-            if (manualScrollRestoration) {
-              window.history.scrollRestoration = "manual";
-            }
+            window.addEventListener("popstate", this.onPopState);
           }
         } // @deprecated backwards compatibility even though it's a private method.
 
@@ -1084,28 +1036,6 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
                 }
 
                 Router.events.emit("beforeHistoryChange", as);
-
-                if (manualScrollRestoration && history.state) {
-                  var {
-                    url: curUrl,
-                    as: curAs,
-                    options: curOptions
-                  } = history.state;
-                  this.changeState(
-                    "replaceState",
-                    curUrl,
-                    curAs,
-                    _objectSpread(
-                      _objectSpread({}, curOptions),
-                      {},
-                      {
-                        _N_X: window.scrollX,
-                        _N_Y: window.scrollY
-                      }
-                    )
-                  );
-                }
-
                 this.changeState(method, url, as, options);
 
                 if (false) {
@@ -1125,11 +1055,6 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
                   }
 
                   Router.events.emit("routeChangeComplete", as);
-
-                  if (manualScrollRestoration && "_N_X" in options) {
-                    window.scrollTo(options._N_X, options._N_Y);
-                  }
-
                   return resolve(true);
                 });
               },
@@ -1728,27 +1653,6 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
       /***/
     },
 
-    /***/ lSNA: /***/ function(module, exports) {
-      function _defineProperty(obj, key, value) {
-        if (key in obj) {
-          Object.defineProperty(obj, key, {
-            value: value,
-            enumerable: true,
-            configurable: true,
-            writable: true
-          });
-        } else {
-          obj[key] = value;
-        }
-
-        return obj;
-      }
-
-      module.exports = _defineProperty;
-
-      /***/
-    },
-
     /***/ nOHt: /***/ function(module, exports, __webpack_require__) {
       "use strict";
Diff for index.html 
@@ -24,7 +24,7 @@
     />
     <link
       rel="preload"
-      href="/_next/static/chunks/de003c3a9d308750aa009870a5926f9b18ab31f4.87fcf25f2b371754f0cc.module.js"
+      href="/_next/static/chunks/de003c3a9d308750aa009870a5926f9b18ab31f4.f733a40f0fc0ecaa4b6c.module.js"
       as="script"
       crossorigin="anonymous"
     />
@@ -117,13 +117,13 @@
       type="module"
     ></script>
     <script
-      src="/_next/static/chunks/de003c3a9d308750aa009870a5926f9b18ab31f4.186a977e04a0bd36fce8.js"
+      src="/_next/static/chunks/de003c3a9d308750aa009870a5926f9b18ab31f4.0ea083186308dcf890b6.js"
       async=""
       crossorigin="anonymous"
       nomodule=""
     ></script>
     <script
-      src="/_next/static/chunks/de003c3a9d308750aa009870a5926f9b18ab31f4.87fcf25f2b371754f0cc.module.js"
+      src="/_next/static/chunks/de003c3a9d308750aa009870a5926f9b18ab31f4.f733a40f0fc0ecaa4b6c.module.js"
       async=""
       crossorigin="anonymous"
       type="module"
Diff for link.html 
@@ -24,7 +24,7 @@
     />
     <link
       rel="preload"
-      href="/_next/static/chunks/de003c3a9d308750aa009870a5926f9b18ab31f4.87fcf25f2b371754f0cc.module.js"
+      href="/_next/static/chunks/de003c3a9d308750aa009870a5926f9b18ab31f4.f733a40f0fc0ecaa4b6c.module.js"
       as="script"
       crossorigin="anonymous"
     />
@@ -122,13 +122,13 @@
       type="module"
     ></script>
     <script
-      src="/_next/static/chunks/de003c3a9d308750aa009870a5926f9b18ab31f4.186a977e04a0bd36fce8.js"
+      src="/_next/static/chunks/de003c3a9d308750aa009870a5926f9b18ab31f4.0ea083186308dcf890b6.js"
       async=""
       crossorigin="anonymous"
       nomodule=""
     ></script>
     <script
-      src="/_next/static/chunks/de003c3a9d308750aa009870a5926f9b18ab31f4.87fcf25f2b371754f0cc.module.js"
+      src="/_next/static/chunks/de003c3a9d308750aa009870a5926f9b18ab31f4.f733a40f0fc0ecaa4b6c.module.js"
       async=""
       crossorigin="anonymous"
       type="module"
Diff for withRouter.html 
@@ -24,7 +24,7 @@
     />
     <link
       rel="preload"
-      href="/_next/static/chunks/de003c3a9d308750aa009870a5926f9b18ab31f4.87fcf25f2b371754f0cc.module.js"
+      href="/_next/static/chunks/de003c3a9d308750aa009870a5926f9b18ab31f4.f733a40f0fc0ecaa4b6c.module.js"
       as="script"
       crossorigin="anonymous"
     />
@@ -117,13 +117,13 @@
       type="module"
     ></script>
     <script
-      src="/_next/static/chunks/de003c3a9d308750aa009870a5926f9b18ab31f4.186a977e04a0bd36fce8.js"
+      src="/_next/static/chunks/de003c3a9d308750aa009870a5926f9b18ab31f4.0ea083186308dcf890b6.js"
       async=""
       crossorigin="anonymous"
       nomodule=""
     ></script>
     <script
-      src="/_next/static/chunks/de003c3a9d308750aa009870a5926f9b18ab31f4.87fcf25f2b371754f0cc.module.js"
+      src="/_next/static/chunks/de003c3a9d308750aa009870a5926f9b18ab31f4.f733a40f0fc0ecaa4b6c.module.js"
       async=""
       crossorigin="anonymous"
       type="module"
Serverless Mode (Decrease detected ✓)
General Overall decrease ✓
vercel/next.js canary vercel/next.js revert-13914-add/scroll-restoration Change
buildDuration 14.1s 13.8s -273ms
nodeModulesSize 64.9 MB 64.9 MB -2.21 kB
Client Bundles (main, webpack, commons) Overall decrease ✓
vercel/next.js canary vercel/next.js revert-13914-add/scroll-restoration Change
main-HASH.js gzip 6.49 kB 6.49 kB ✓
webpack-HASH.js gzip 746 B 746 B ✓
de003c3a9d30..3ed8.js gzip 10.9 kB N/A N/A
framework.HASH.js gzip 39.1 kB 39.1 kB ✓
de003c3a9d30..0538.js gzip N/A 10.5 kB N/A
Overall change 57.3 kB 56.9 kB -320 B
Client Bundles (main, webpack, commons) Modern Overall decrease ✓
vercel/next.js canary vercel/next.js revert-13914-add/scroll-restoration Change
main-HASH.module.js gzip 5.58 kB 5.58 kB ✓
webpack-HASH..dule.js gzip 746 B 746 B ✓
de003c3a9d30..dule.js gzip 7.27 kB N/A N/A
framework.HA..dule.js gzip 39.1 kB 39.1 kB ✓
de003c3a9d30..dule.js gzip N/A 6.93 kB N/A
Overall change 52.7 kB 52.4 kB -342 B
Legacy Client Bundles (polyfills)
vercel/next.js canary vercel/next.js revert-13914-add/scroll-restoration Change
polyfills-HASH.js gzip 26.3 kB 26.3 kB ✓
Overall change 26.3 kB 26.3 kB ✓
Client Pages
vercel/next.js canary vercel/next.js revert-13914-add/scroll-restoration Change
routerDirect.js gzip 279 B 279 B ✓
withRouter.js gzip 278 B 278 B ✓
index.js gzip 222 B 222 B ✓
link.js gzip 2.05 kB 2.05 kB ✓
hooks.js gzip 881 B 881 B ✓
_app.js gzip 1.26 kB 1.26 kB ✓
_error.js gzip 3.25 kB 3.25 kB ✓
Overall change 8.22 kB 8.22 kB ✓
Client Pages Modern
vercel/next.js canary vercel/next.js revert-13914-add/scroll-restoration Change
index.module.js gzip 223 B 223 B ✓
routerDirect..dule.js gzip 281 B 281 B ✓
withRouter.m..dule.js gzip 278 B 278 B ✓
_error.module.js gzip 2.04 kB 2.04 kB ✓
hooks.module.js gzip 383 B 383 B ✓
link.module.js gzip 1.52 kB 1.52 kB ✓
_app.module.js gzip 604 B 604 B ✓
Overall change 5.33 kB 5.33 kB ✓
Client Build Manifests
vercel/next.js canary vercel/next.js revert-13914-add/scroll-restoration Change
_buildManifest.js gzip 270 B 270 B ✓
_buildManife..dule.js gzip 275 B 275 B ✓
Overall change 545 B 545 B ✓
Serverless bundles Overall decrease ✓
vercel/next.js canary vercel/next.js revert-13914-add/scroll-restoration Change
_error.js 875 kB 875 kB ✓
404.html 4.17 kB 4.17 kB ✓
hooks.html 3.79 kB 3.79 kB ✓
index.js 875 kB 875 kB ✓
link.js 915 kB 913 kB -1.66 kB
routerDirect.js 907 kB 905 kB -1.66 kB
withRouter.js 907 kB 905 kB -1.66 kB
Overall change 4.49 MB 4.48 MB -4.98 kB

@Timer Timer changed the title Revert "Add scroll restoration handling after render is complete" Revert "Add scroll restoration handling after render is done" Jun 11, 2020
@Timer Timer merged commit c8b51b5 into canary Jun 11, 2020
@Timer Timer deleted the revert-13914-add/scroll-restoration branch June 11, 2020 14:40
darshkpatel pushed a commit to MLH-Fellowship/next.js that referenced this pull request Jun 12, 2020
@Timer @darshkpatel
Revert "Add scroll restoration handling after render is done" (vercel…
b27fdfe 
…#14075)
kodiakhq bot pushed a commit that referenced this pull request Jul 6, 2020
@ijjk
Re-enable scroll restoration behind flag (#14046)
38bd1a0 
This updates the scroll position saving to occur as the scroll position changes instead of trying to do it when the navigation is changing since the `popState` event doesn't allow us to update the leaving history state once the `popState` has occurred. 

The order of events that was previously attempted to save scroll position on a `popState` event (back/forward navigation)

1. history.state is already updated with state from `popState`
2. we replace state with the currently rendered page adding scroll info
3. we replace state again with the `popState` event state overriding scroll info

Using this approach the above event order is no longer in conflict since we don't attempt to populate the state with scroll position while it's leaving the state and instead do it while it is still the active state in history

This approach resembles existing solutions:
https://www.npmjs.com/package/scroll-behavior
https://twitter.com/ryanflorence/status/1029121580855488512

Fixes: #13990
Fixes: #12530
x-ref: #14075
rokinsky pushed a commit to rokinsky/next.js that referenced this pull request Jul 11, 2020
@Timer @rokinsky
Revert "Add scroll restoration handling after render is done" (vercel…
1bdcd0c 
…#14075)
rokinsky pushed a commit to rokinsky/next.js that referenced this pull request Jul 11, 2020
@ijjk @rokinsky
Re-enable scroll restoration behind flag (vercel#14046)
8b9aa2a 
This updates the scroll position saving to occur as the scroll position changes instead of trying to do it when the navigation is changing since the `popState` event doesn't allow us to update the leaving history state once the `popState` has occurred. 

The order of events that was previously attempted to save scroll position on a `popState` event (back/forward navigation)

1. history.state is already updated with state from `popState`
2. we replace state with the currently rendered page adding scroll info
3. we replace state again with the `popState` event state overriding scroll info

Using this approach the above event order is no longer in conflict since we don't attempt to populate the state with scroll position while it's leaving the state and instead do it while it is still the active state in history

This approach resembles existing solutions:
https://www.npmjs.com/package/scroll-behavior
https://twitter.com/ryanflorence/status/1029121580855488512

Fixes: vercel#13990
Fixes: vercel#12530
x-ref: vercel#14075
@vercel vercel locked as resolved and limited conversation to collaborators Jan 30, 2022
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Reviewers

@timneutkens timneutkens timneutkens left review comments

@lfades lfades Awaiting requested review from lfades

@ijjk ijjk Awaiting requested review from ijjk

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

Successfully merging this pull request may close these issues.
3 participants
@Timer @ijjk @timneutkens