update webpack to 5.36.2, use dependOn #24656

sokra · 2021-04-30T12:48:58Z

update webpack to 5.36.2
use dependOn to optimize chunks
disable vendor splitting for main and _app chunks

=> decreases bundle size in general, gets rid of the 2 extra vendor chunks shared by all pages.

Bug

Related issues linked using fixes #number
Integration tests added

Feature

Implements an existing feature request or RFC. Make sure the feature request has been accepted for implementation before opening a PR.
Related issues linked using fixes #number
Integration tests added
Documentation added
Telemetry added. In case of a feature if it's used or not.

Documentation / Examples

Make sure the linting passes

disable vendor splitting for main and _app chunks

ijjk · 2021-05-01T19:27:21Z

Stats from current PR

Default Server Mode (Increase detected ⚠️)

General Overall increase ⚠️

	vercel/next.js canary	vercel/next.js webpack/dependOn	Change
buildDuration	16.1s	15.9s	-257ms
buildDurationCached	5.4s	5s	-368ms
nodeModulesSize	46.6 MB	46.6 MB	⚠️ +21.4 kB

Page Load Tests Overall increase ✓

	vercel/next.js canary	vercel/next.js webpack/dependOn	Change
/ failed reqs	0	0	✓
/ total time (seconds)	2.853	2.814	-0.04
/ avg req/sec	876.42	888.54	+12.12
/error-in-render failed reqs	0	0	✓
/error-in-render total time (seconds)	1.688	1.504	-0.18
/error-in-render avg req/sec	1480.72	1661.96	+181.24

Client Bundles (main, webpack, commons) Overall decrease ✓

	vercel/next.js canary	vercel/next.js webpack/dependOn	Change
597-HASH.js gzip	13.2 kB	N/A	N/A
778-HASH.js gzip	7.12 kB	N/A	N/A
framework-HASH.js gzip	39.3 kB	39.3 kB	✓
main-HASH.js gzip	151 B	19.3 kB	⚠️ +19.2 kB
webpack-HASH.js gzip	993 B	996 B	⚠️ +3 B
Overall change	60.8 kB	59.6 kB	-1.16 kB

Legacy Client Bundles (polyfills) Overall increase ⚠️

	vercel/next.js canary	vercel/next.js webpack/dependOn	Change
polyfills-HASH.js gzip	31.1 kB	31.1 kB	⚠️ +23 B
Overall change	31.1 kB	31.1 kB	⚠️ +23 B

Client Pages Overall decrease ✓

	vercel/next.js canary	vercel/next.js webpack/dependOn	Change
_app-HASH.js gzip	1.3 kB	1.02 kB	-279 B
_error-HASH.js gzip	3.68 kB	3.04 kB	-644 B
amp-HASH.js gzip	558 B	526 B	-32 B
css-HASH.js gzip	363 B	334 B	-29 B
hooks-HASH.js gzip	924 B	890 B	-34 B
index-HASH.js gzip	243 B	262 B	⚠️ +19 B
link-HASH.js gzip	1.66 kB	1.65 kB	-5 B
routerDirect..HASH.js gzip	336 B	331 B	-5 B
withRouter-HASH.js gzip	334 B	329 B	-5 B
99a142a5cfae..804.css gzip	125 B	125 B	✓
Overall change	9.52 kB	8.51 kB	-1.01 kB

Client Build Manifests Overall decrease ✓

	vercel/next.js canary	vercel/next.js webpack/dependOn	Change
_buildManifest.js gzip	395 B	393 B	-2 B
Overall change	395 B	393 B	-2 B

Rendered Page Sizes Overall decrease ✓

	vercel/next.js canary	vercel/next.js webpack/dependOn	Change
index.html gzip	607 B	561 B	-46 B
link.html gzip	614 B	570 B	-44 B
withRouter.html gzip	602 B	557 B	-45 B
Overall change	1.82 kB	1.69 kB	-135 B

Diffs

Diff for _buildManifest.js

@@ -1,23 +1,23 @@
 self.__BUILD_MANIFEST = {
   __rewrites: { beforeFiles: [], afterFiles: [], fallback: [] },
-  "/": ["static\u002Fchunks\u002Fpages\u002Findex-fec729acd14e4a5583b2.js"],
+  "/": ["static\u002Fchunks\u002Fpages\u002Findex-781a77dd168190130aad.js"],
   "/_error": [
-    "static\u002Fchunks\u002Fpages\u002F_error-55112c9d838f988b054d.js"
+    "static\u002Fchunks\u002Fpages\u002F_error-9459a67ba367dde23f4d.js"
   ],
-  "/amp": ["static\u002Fchunks\u002Fpages\u002Famp-89a5460cada4d99b567f.js"],
+  "/amp": ["static\u002Fchunks\u002Fpages\u002Famp-a0345799be7f0667d737.js"],
   "/css": [
     "static\u002Fcss\u002F99a142a5cfae69599804.css",
-    "static\u002Fchunks\u002Fpages\u002Fcss-ba062d31c437b1fc3e65.js"
+    "static\u002Fchunks\u002Fpages\u002Fcss-80c359352806cb30a49e.js"
   ],
   "/hooks": [
-    "static\u002Fchunks\u002Fpages\u002Fhooks-8c2e74bb2b6bffaebe37.js"
+    "static\u002Fchunks\u002Fpages\u002Fhooks-f8aa55ff3468eec0f00f.js"
   ],
-  "/link": ["static\u002Fchunks\u002Fpages\u002Flink-e010d772d10ae2f9a50c.js"],
+  "/link": ["static\u002Fchunks\u002Fpages\u002Flink-6a1ed7679522abd5b06f.js"],
   "/routerDirect": [
-    "static\u002Fchunks\u002Fpages\u002FrouterDirect-86b413d0659e50665759.js"
+    "static\u002Fchunks\u002Fpages\u002FrouterDirect-68fbc73b3c10216470f7.js"
   ],
   "/withRouter": [
-    "static\u002Fchunks\u002Fpages\u002FwithRouter-186b16dd09ed427898bf.js"
+    "static\u002Fchunks\u002Fpages\u002FwithRouter-1cc742358c254ca372dd.js"
   ],
   sortedPages: [
     "\u002F",

Diff for _app-HASH.js

@@ -1,91 +1,6 @@
 (self["webpackChunk_N_E"] = self["webpackChunk_N_E"] || []).push([
-  [888, 179],
+  [888],
   {
-    /***/ 1506: /***/ function(module) {
-      function _assertThisInitialized(self) {
-        if (self === void 0) {
-          throw new ReferenceError(
-            "this hasn't been initialised - super() hasn't been called"
-          );
-        }
-
-        return self;
-      }
-
-      module.exports = _assertThisInitialized;
-
-      /***/
-    },
-
-    /***/ 9754: /***/ function(module) {
-      function _getPrototypeOf(o) {
-        module.exports = _getPrototypeOf = Object.setPrototypeOf
-          ? Object.getPrototypeOf
-          : function _getPrototypeOf(o) {
-              return o.__proto__ || Object.getPrototypeOf(o);
-            };
-        return _getPrototypeOf(o);
-      }
-
-      module.exports = _getPrototypeOf;
-
-      /***/
-    },
-
-    /***/ 2205: /***/ function(
-      module,
-      __unused_webpack_exports,
-      __webpack_require__
-    ) {
-      var setPrototypeOf = __webpack_require__(9489);
-
-      function _inherits(subClass, superClass) {
-        if (typeof superClass !== "function" && superClass !== null) {
-          throw new TypeError(
-            "Super expression must either be null or a function"
-          );
-        }
-
-        subClass.prototype = Object.create(superClass && superClass.prototype, {
-          constructor: {
-            value: subClass,
-            writable: true,
-            configurable: true
-          }
-        });
-        if (superClass) setPrototypeOf(subClass, superClass);
-      }
-
-      module.exports = _inherits;
-
-      /***/
-    },
-
-    /***/ 8585: /***/ function(
-      module,
-      __unused_webpack_exports,
-      __webpack_require__
-    ) {
-      var _typeof = __webpack_require__(8);
-
-      var assertThisInitialized = __webpack_require__(1506);
-
-      function _possibleConstructorReturn(self, call) {
-        if (
-          call &&
-          (_typeof(call) === "object" || typeof call === "function")
-        ) {
-          return call;
-        }
-
-        return assertThisInitialized(self);
-      }
-
-      module.exports = _possibleConstructorReturn;
-
-      /***/
-    },
-
     /***/ 6381: /***/ function(
       __unused_webpack_module,
       exports,
@@ -323,11 +238,6 @@
         }
       ]);
 
-      /***/
-    },
-
-    /***/ 4453: /***/ function() {
-      /* (ignored) */
       /***/
     }
   },
@@ -339,7 +249,7 @@
     /******/ var __webpack_exec__ = function(moduleId) {
       return __webpack_require__((__webpack_require__.s = moduleId));
     };
-    /******/ __webpack_require__.O(0, [774, 597], function() {
+    /******/ __webpack_require__.O(0, [774, 179], function() {
       return __webpack_exec__(915), __webpack_exec__(2441);
     });
     /******/ var __webpack_exports__ = __webpack_require__.O();

Diff for _error-HASH.js

@@ -1,22 +1,6 @@
 (self["webpackChunk_N_E"] = self["webpackChunk_N_E"] || []).push([
   [820],
   {
-    /***/ 7228: /***/ function(module) {
-      function _arrayLikeToArray(arr, len) {
-        if (len == null || len > arr.length) len = arr.length;
-
-        for (var i = 0, arr2 = new Array(len); i < len; i++) {
-          arr2[i] = arr[i];
-        }
-
-        return arr2;
-      }
-
-      module.exports = _arrayLikeToArray;
-
-      /***/
-    },
-
     /***/ 3646: /***/ function(
       module,
       __unused_webpack_exports,
@@ -33,56 +17,6 @@
       /***/
     },
 
-    /***/ 1506: /***/ function(module) {
-      function _assertThisInitialized(self) {
-        if (self === void 0) {
-          throw new ReferenceError(
-            "this hasn't been initialised - super() hasn't been called"
-          );
-        }
-
-        return self;
-      }
-
-      module.exports = _assertThisInitialized;
-
-      /***/
-    },
-
-    /***/ 4575: /***/ function(module) {
-      function _classCallCheck(instance, Constructor) {
-        if (!(instance instanceof Constructor)) {
-          throw new TypeError("Cannot call a class as a function");
-        }
-      }
-
-      module.exports = _classCallCheck;
-
-      /***/
-    },
-
-    /***/ 3913: /***/ function(module) {
-      function _defineProperties(target, props) {
-        for (var i = 0; i < props.length; i++) {
-          var descriptor = props[i];
-          descriptor.enumerable = descriptor.enumerable || false;
-          descriptor.configurable = true;
-          if ("value" in descriptor) descriptor.writable = true;
-          Object.defineProperty(target, descriptor.key, descriptor);
-        }
-      }
-
-      function _createClass(Constructor, protoProps, staticProps) {
-        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
-        if (staticProps) _defineProperties(Constructor, staticProps);
-        return Constructor;
-      }
-
-      module.exports = _createClass;
-
-      /***/
-    },
-
     /***/ 9713: /***/ function(module) {
       function _defineProperty(obj, key, value) {
         if (key in obj) {
@@ -104,64 +38,6 @@
       /***/
     },
 
-    /***/ 9754: /***/ function(module) {
-      function _getPrototypeOf(o) {
-        module.exports = _getPrototypeOf = Object.setPrototypeOf
-          ? Object.getPrototypeOf
-          : function _getPrototypeOf(o) {
-              return o.__proto__ || Object.getPrototypeOf(o);
-            };
-        return _getPrototypeOf(o);
-      }
-
-      module.exports = _getPrototypeOf;
-
-      /***/
-    },
-
-    /***/ 2205: /***/ function(
-      module,
-      __unused_webpack_exports,
-      __webpack_require__
-    ) {
-      var setPrototypeOf = __webpack_require__(9489);
-
-      function _inherits(subClass, superClass) {
-        if (typeof superClass !== "function" && superClass !== null) {
-          throw new TypeError(
-            "Super expression must either be null or a function"
-          );
-        }
-
-        subClass.prototype = Object.create(superClass && superClass.prototype, {
-          constructor: {
-            value: subClass,
-            writable: true,
-            configurable: true
-          }
-        });
-        if (superClass) setPrototypeOf(subClass, superClass);
-      }
-
-      module.exports = _inherits;
-
-      /***/
-    },
-
-    /***/ 5318: /***/ function(module) {
-      function _interopRequireDefault(obj) {
-        return obj && obj.__esModule
-          ? obj
-          : {
-              default: obj
-            };
-      }
-
-      module.exports = _interopRequireDefault;
-
-      /***/
-    },
-
     /***/ 6860: /***/ function(module) {
       function _iterableToArray(iter) {
         if (typeof Symbol !== "undefined" && Symbol.iterator in Object(iter))
@@ -185,48 +61,6 @@
       /***/
     },
 
-    /***/ 8585: /***/ function(
-      module,
-      __unused_webpack_exports,
-      __webpack_require__
-    ) {
-      var _typeof = __webpack_require__(8);
-
-      var assertThisInitialized = __webpack_require__(1506);
-
-      function _possibleConstructorReturn(self, call) {
-        if (
-          call &&
-          (_typeof(call) === "object" || typeof call === "function")
-        ) {
-          return call;
-        }
-
-        return assertThisInitialized(self);
-      }
-
-      module.exports = _possibleConstructorReturn;
-
-      /***/
-    },
-
-    /***/ 9489: /***/ function(module) {
-      function _setPrototypeOf(o, p) {
-        module.exports = _setPrototypeOf =
-          Object.setPrototypeOf ||
-          function _setPrototypeOf(o, p) {
-            o.__proto__ = p;
-            return o;
-          };
-
-        return _setPrototypeOf(o, p);
-      }
-
-      module.exports = _setPrototypeOf;
-
-      /***/
-    },
-
     /***/ 319: /***/ function(
       module,
       __unused_webpack_exports,
@@ -254,71 +88,6 @@
       /***/
     },
 
-    /***/ 8: /***/ function(module) {
-      function _typeof(obj) {
-        "@babel/helpers - typeof";
-
-        if (
-          typeof Symbol === "function" &&
-          typeof Symbol.iterator === "symbol"
-        ) {
-          module.exports = _typeof = function _typeof(obj) {
-            return typeof obj;
-          };
-        } else {
-          module.exports = _typeof = function _typeof(obj) {
-            return obj &&
-              typeof Symbol === "function" &&
-              obj.constructor === Symbol &&
-              obj !== Symbol.prototype
-              ? "symbol"
-              : typeof obj;
-          };
-        }
-
-        return _typeof(obj);
-      }
-
-      module.exports = _typeof;
-
-      /***/
-    },
-
-    /***/ 379: /***/ function(
-      module,
-      __unused_webpack_exports,
-      __webpack_require__
-    ) {
-      var arrayLikeToArray = __webpack_require__(7228);
-
-      function _unsupportedIterableToArray(o, minLen) {
-        if (!o) return;
-        if (typeof o === "string") return arrayLikeToArray(o, minLen);
-        var n = Object.prototype.toString.call(o).slice(8, -1);
-        if (n === "Object" && o.constructor) n = o.constructor.name;
-        if (n === "Map" || n === "Set") return Array.from(o);
-        if (
-          n === "Arguments" ||
-          /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)
-        )
-          return arrayLikeToArray(o, minLen);
-      }
-
-      module.exports = _unsupportedIterableToArray;
-
-      /***/
-    },
-
-    /***/ 6086: /***/ function(module) {
-      "use strict";
-      var assign = Object.assign.bind(Object);
-      module.exports = assign;
-      module.exports.default = module.exports;
-      //# sourceMappingURL=object-assign.js.map
-
-      /***/
-    },
-
     /***/ 3367: /***/ function(
       __unused_webpack_module,
       exports,
@@ -397,38 +166,6 @@
       /***/
     },
 
-    /***/ 4287: /***/ function(
-      __unused_webpack_module,
-      exports,
-      __webpack_require__
-    ) {
-      "use strict";
-
-      exports.__esModule = true;
-      exports.HeadManagerContext = void 0;
-
-      var _react = _interopRequireDefault(__webpack_require__(7294));
-
-      function _interopRequireDefault(obj) {
-        return obj && obj.__esModule
-          ? obj
-          : {
-              default: obj
-            };
-      }
-
-      var HeadManagerContext = /*#__PURE__*/ _react["default"].createContext(
-        {}
-      );
-
-      exports.HeadManagerContext = HeadManagerContext;
-
-      if (false) {
-      }
-
-      /***/
-    },
-
     /***/ 7947: /***/ function(
       __unused_webpack_module,
       exports,
@@ -1111,7 +848,7 @@ Also adds support for deduplicated `key` properties
     /******/ var __webpack_exec__ = function(moduleId) {
       return __webpack_require__((__webpack_require__.s = moduleId));
     };
-    /******/ __webpack_require__.O(0, [774], function() {
+    /******/ __webpack_require__.O(0, [888, 774, 179], function() {
       return __webpack_exec__(4977);
     });
     /******/ var __webpack_exports__ = __webpack_require__.O();

Diff for amp-HASH.js

@@ -11,16 +11,6 @@
       /***/
     },
 
-    /***/ 6086: /***/ function(module) {
-      "use strict";
-      var assign = Object.assign.bind(Object);
-      module.exports = assign;
-      module.exports.default = module.exports;
-      //# sourceMappingURL=object-assign.js.map
-
-      /***/
-    },
-
     /***/ 3367: /***/ function(
       __unused_webpack_module,
       exports,
@@ -131,7 +121,7 @@
       /***/
     },
 
-    /***/ 6071: /***/ function(
+    /***/ 5921: /***/ function(
       __unused_webpack_module,
       __unused_webpack_exports,
       __webpack_require__
@@ -154,8 +144,8 @@
     /******/ var __webpack_exec__ = function(moduleId) {
       return __webpack_require__((__webpack_require__.s = moduleId));
     };
-    /******/ __webpack_require__.O(0, [774], function() {
-      return __webpack_exec__(6071);
+    /******/ __webpack_require__.O(0, [888, 774, 179], function() {
+      return __webpack_exec__(5921);
     });
     /******/ var __webpack_exports__ = __webpack_require__.O();
     /******/ _N_E = __webpack_exports__;

Diff for css-HASH.js

@@ -1,16 +1,6 @@
 (self["webpackChunk_N_E"] = self["webpackChunk_N_E"] || []).push([
   [706],
   {
-    /***/ 6086: /***/ function(module) {
-      "use strict";
-      var assign = Object.assign.bind(Object);
-      module.exports = assign;
-      module.exports.default = module.exports;
-      //# sourceMappingURL=object-assign.js.map
-
-      /***/
-    },
-
     /***/ 7250: /***/ function(
       __unused_webpack_module,
       __webpack_exports__,
@@ -79,7 +69,7 @@
     /******/ var __webpack_exec__ = function(moduleId) {
       return __webpack_require__((__webpack_require__.s = moduleId));
     };
-    /******/ __webpack_require__.O(0, [774], function() {
+    /******/ __webpack_require__.O(0, [888, 774, 179], function() {
       return __webpack_exec__(7083);
     });
     /******/ var __webpack_exports__ = __webpack_require__.O();

Diff for hooks-HASH.js

@@ -1,16 +1,6 @@
 (self["webpackChunk_N_E"] = self["webpackChunk_N_E"] || []).push([
   [757],
   {
-    /***/ 6086: /***/ function(module) {
-      "use strict";
-      var assign = Object.assign.bind(Object);
-      module.exports = assign;
-      module.exports.default = module.exports;
-      //# sourceMappingURL=object-assign.js.map
-
-      /***/
-    },
-
     /***/ 7690: /***/ function(
       __unused_webpack_module,
       __webpack_exports__,
@@ -170,7 +160,7 @@
     /******/ var __webpack_exec__ = function(moduleId) {
       return __webpack_require__((__webpack_require__.s = moduleId));
     };
-    /******/ __webpack_require__.O(0, [774], function() {
+    /******/ __webpack_require__.O(0, [888, 774, 179], function() {
       return __webpack_exec__(1470);
     });
     /******/ var __webpack_exports__ = __webpack_require__.O();

Diff for index-HASH.js

@@ -44,7 +44,10 @@
     /******/ var __webpack_exec__ = function(moduleId) {
       return __webpack_require__((__webpack_require__.s = moduleId));
     };
-    /******/ var __webpack_exports__ = __webpack_exec__(8581);
+    /******/ __webpack_require__.O(0, [888, 774, 179], function() {
+      return __webpack_exec__(8581);
+    });
+    /******/ var __webpack_exports__ = __webpack_require__.O();
     /******/ _N_E = __webpack_exports__;
     /******/
   }

Diff for link-HASH.js

@@ -1,7 +1,7 @@
 (self["webpackChunk_N_E"] = self["webpackChunk_N_E"] || []).push([
-  [644, 179],
+  [644],
   {
-    /***/ 573: /***/ function(
+    /***/ 6071: /***/ function(
       __unused_webpack_module,
       exports,
       __webpack_require__
@@ -441,13 +441,8 @@
       __unused_webpack_exports,
       __webpack_require__
     ) {
-      module.exports = __webpack_require__(573);
+      module.exports = __webpack_require__(6071);
 
-      /***/
-    },
-
-    /***/ 4453: /***/ function() {
-      /* (ignored) */
       /***/
     }
   },
@@ -459,7 +454,7 @@
     /******/ var __webpack_exec__ = function(moduleId) {
       return __webpack_require__((__webpack_require__.s = moduleId));
     };
-    /******/ __webpack_require__.O(0, [774, 597], function() {
+    /******/ __webpack_require__.O(0, [888, 774, 179], function() {
       return __webpack_exec__(7847);
     });
     /******/ var __webpack_exports__ = __webpack_require__.O();

Diff for routerDirect-HASH.js

@@ -1,5 +1,5 @@
 (self["webpackChunk_N_E"] = self["webpackChunk_N_E"] || []).push([
-  [58, 179],
+  [58],
   {
     /***/ 1348: /***/ function(
       __unused_webpack_module,
@@ -59,11 +59,6 @@
     ) {
       module.exports = __webpack_require__(2441);
 
-      /***/
-    },
-
-    /***/ 4453: /***/ function() {
-      /* (ignored) */
       /***/
     }
   },
@@ -75,7 +70,7 @@
     /******/ var __webpack_exec__ = function(moduleId) {
       return __webpack_require__((__webpack_require__.s = moduleId));
     };
-    /******/ __webpack_require__.O(0, [774, 597], function() {
+    /******/ __webpack_require__.O(0, [888, 774, 179], function() {
       return __webpack_exec__(5448);
     });
     /******/ var __webpack_exports__ = __webpack_require__.O();

Diff for withRouter-HASH.js

@@ -1,5 +1,5 @@
 (self["webpackChunk_N_E"] = self["webpackChunk_N_E"] || []).push([
-  [807, 179],
+  [807],
   {
     /***/ 7024: /***/ function(
       __unused_webpack_module,
@@ -56,11 +56,6 @@
     ) {
       module.exports = __webpack_require__(2441);
 
-      /***/
-    },
-
-    /***/ 4453: /***/ function() {
-      /* (ignored) */
       /***/
     }
   },
@@ -72,7 +67,7 @@
     /******/ var __webpack_exec__ = function(moduleId) {
       return __webpack_require__((__webpack_require__.s = moduleId));
     };
-    /******/ __webpack_require__.O(0, [774, 597], function() {
+    /******/ __webpack_require__.O(0, [888, 774, 179], function() {
       return __webpack_exec__(6744);
     });
     /******/ var __webpack_exports__ = __webpack_require__.O();

Diff for 597-HASH.js

deleted

Diff for 778-HASH.js

deleted

Diff for main-HASH.js

failed to diff

Diff for polyfills-HASH.js

@@ -6570,7 +6570,10 @@
     /******/ var __webpack_exec__ = function(moduleId) {
       return __webpack_require__((__webpack_require__.s = moduleId));
     };
-    /******/ var __webpack_exports__ = __webpack_exec__(8838);
+    /******/ __webpack_require__.O(0, [774, 179], function() {
+      return __webpack_exec__(8838);
+    });
+    /******/ var __webpack_exports__ = __webpack_require__.O();
     /******/ _N_E = __webpack_exports__;
     /******/
   }

Diff for webpack-HASH.js

@@ -201,10 +201,18 @@
       .replace(/\/[^\/]+$/, "/");
     /******/ __webpack_require__.p = scriptUrl + "../../";
     /******/
-  })(); /* webpack/runtime/jsonp chunk loading */
+  })(); /* webpack/runtime/compat */ // object to store loaded CSS chunks
   /******/
 
-  /******/ /******/ !(function() {
+  /******/ /******/
+
+  /******/
+
+  /******/ /******/ var installedCssChunks = {
+    /******/ 272: 0
+    /******/
+  }; /* webpack/runtime/jsonp chunk loading */
+  /******/ !(function() {
     /******/ // no baseURI
     /******/
 
@@ -249,7 +257,7 @@
         }
         /******/
       }
-      /******/ if (runtime) runtime(__webpack_require__);
+      /******/ if (runtime) var result = runtime(__webpack_require__);
       /******/ if (parentChunkLoadingFunction) parentChunkLoadingFunction(data);
       /******/ for (; i < chunkIds.length; i++) {
         /******/ chunkId = chunkIds[i];
@@ -263,7 +271,7 @@
         /******/ installedChunks[chunkIds[i]] = 0;
         /******/
       }
-      /******/ __webpack_require__.O();
+      /******/ return __webpack_require__.O(result);
       /******/
     };
     /******/
@@ -278,9 +286,8 @@
     /******/
   })();
   /******/
-
   /************************************************************************/
-  var __webpack_exports__ = {};
-  __webpack_require__.O();
+  /******/
+  /******/
   /******/
 })();

Diff for index.html

@@ -7,37 +7,27 @@
     <noscript data-n-css=""></noscript>
     <link
       rel="preload"
-      href="/_next/static/chunks/webpack-06f549fe60c32356e0c0.js"
+      href="/_next/static/chunks/webpack-dd6fffdf0dbc836f25a7.js"
       as="script"
     />
     <link
       rel="preload"
-      href="/_next/static/chunks/framework-c77a2c3c8479e94a0d30.js"
+      href="/_next/static/chunks/framework-5f4c69587bb7e3f0b3d9.js"
       as="script"
     />
     <link
       rel="preload"
-      href="/_next/static/chunks/597-1b9c2a3fa8cca5953f4e.js"
+      href="/_next/static/chunks/main-ffe9a79757f747d52ab7.js"
       as="script"
     />
     <link
       rel="preload"
-      href="/_next/static/chunks/778-7689030f4cd652c7d7fe.js"
+      href="/_next/static/chunks/pages/_app-a34876d2dde10c4d8851.js"
       as="script"
     />
     <link
       rel="preload"
-      href="/_next/static/chunks/main-9ca82ec4d4aca520c43d.js"
-      as="script"
-    />
-    <link
-      rel="preload"
-      href="/_next/static/chunks/pages/_app-5cc66b2123b5f30f6f03.js"
-      as="script"
-    />
-    <link
-      rel="preload"
-      href="/_next/static/chunks/pages/index-fec729acd14e4a5583b2.js"
+      href="/_next/static/chunks/pages/index-781a77dd168190130aad.js"
       as="script"
     />
   </head>
@@ -55,34 +45,26 @@
     </script>
     <script
       nomodule=""
-      src="/_next/static/chunks/polyfills-8683bd742a84c1edd48c.js"
-    ></script>
-    <script
-      src="/_next/static/chunks/webpack-06f549fe60c32356e0c0.js"
-      async=""
-    ></script>
-    <script
-      src="/_next/static/chunks/framework-c77a2c3c8479e94a0d30.js"
-      async=""
+      src="/_next/static/chunks/polyfills-01e9caf46d9a7f038c09.js"
     ></script>
     <script
-      src="/_next/static/chunks/597-1b9c2a3fa8cca5953f4e.js"
+      src="/_next/static/chunks/webpack-dd6fffdf0dbc836f25a7.js"
       async=""
     ></script>
     <script
-      src="/_next/static/chunks/778-7689030f4cd652c7d7fe.js"
+      src="/_next/static/chunks/framework-5f4c69587bb7e3f0b3d9.js"
       async=""
     ></script>
     <script
-      src="/_next/static/chunks/main-9ca82ec4d4aca520c43d.js"
+      src="/_next/static/chunks/main-ffe9a79757f747d52ab7.js"
       async=""
     ></script>
     <script
-      src="/_next/static/chunks/pages/_app-5cc66b2123b5f30f6f03.js"
+      src="/_next/static/chunks/pages/_app-a34876d2dde10c4d8851.js"
       async=""
     ></script>
     <script
-      src="/_next/static/chunks/pages/index-fec729acd14e4a5583b2.js"
+      src="/_next/static/chunks/pages/index-781a77dd168190130aad.js"
       async=""
     ></script>
     <script src="/_next/static/BUILD_ID/_buildManifest.js" async=""></script>

Diff for link.html

@@ -7,37 +7,27 @@
     <noscript data-n-css=""></noscript>
     <link
       rel="preload"
-      href="/_next/static/chunks/webpack-06f549fe60c32356e0c0.js"
+      href="/_next/static/chunks/webpack-dd6fffdf0dbc836f25a7.js"
       as="script"
     />
     <link
       rel="preload"
-      href="/_next/static/chunks/framework-c77a2c3c8479e94a0d30.js"
+      href="/_next/static/chunks/framework-5f4c69587bb7e3f0b3d9.js"
       as="script"
     />
     <link
       rel="preload"
-      href="/_next/static/chunks/597-1b9c2a3fa8cca5953f4e.js"
+      href="/_next/static/chunks/main-ffe9a79757f747d52ab7.js"
       as="script"
     />
     <link
       rel="preload"
-      href="/_next/static/chunks/778-7689030f4cd652c7d7fe.js"
+      href="/_next/static/chunks/pages/_app-a34876d2dde10c4d8851.js"
       as="script"
     />
     <link
       rel="preload"
-      href="/_next/static/chunks/main-9ca82ec4d4aca520c43d.js"
-      as="script"
-    />
-    <link
-      rel="preload"
-      href="/_next/static/chunks/pages/_app-5cc66b2123b5f30f6f03.js"
-      as="script"
-    />
-    <link
-      rel="preload"
-      href="/_next/static/chunks/pages/link-e010d772d10ae2f9a50c.js"
+      href="/_next/static/chunks/pages/link-6a1ed7679522abd5b06f.js"
       as="script"
     />
   </head>
@@ -60,34 +50,26 @@
     </script>
     <script
       nomodule=""
-      src="/_next/static/chunks/polyfills-8683bd742a84c1edd48c.js"
-    ></script>
-    <script
-      src="/_next/static/chunks/webpack-06f549fe60c32356e0c0.js"
-      async=""
-    ></script>
-    <script
-      src="/_next/static/chunks/framework-c77a2c3c8479e94a0d30.js"
-      async=""
+      src="/_next/static/chunks/polyfills-01e9caf46d9a7f038c09.js"
     ></script>
     <script
-      src="/_next/static/chunks/597-1b9c2a3fa8cca5953f4e.js"
+      src="/_next/static/chunks/webpack-dd6fffdf0dbc836f25a7.js"
       async=""
     ></script>
     <script
-      src="/_next/static/chunks/778-7689030f4cd652c7d7fe.js"
+      src="/_next/static/chunks/framework-5f4c69587bb7e3f0b3d9.js"
       async=""
     ></script>
     <script
-      src="/_next/static/chunks/main-9ca82ec4d4aca520c43d.js"
+      src="/_next/static/chunks/main-ffe9a79757f747d52ab7.js"
       async=""
     ></script>
     <script
-      src="/_next/static/chunks/pages/_app-5cc66b2123b5f30f6f03.js"
+      src="/_next/static/chunks/pages/_app-a34876d2dde10c4d8851.js"
       async=""
     ></script>
     <script
-      src="/_next/static/chunks/pages/link-e010d772d10ae2f9a50c.js"
+      src="/_next/static/chunks/pages/link-6a1ed7679522abd5b06f.js"
       async=""
     ></script>
     <script src="/_next/static/BUILD_ID/_buildManifest.js" async=""></script>

Diff for withRouter.html

@@ -7,37 +7,27 @@
     <noscript data-n-css=""></noscript>
     <link
       rel="preload"
-      href="/_next/static/chunks/webpack-06f549fe60c32356e0c0.js"
+      href="/_next/static/chunks/webpack-dd6fffdf0dbc836f25a7.js"
       as="script"
     />
     <link
       rel="preload"
-      href="/_next/static/chunks/framework-c77a2c3c8479e94a0d30.js"
+      href="/_next/static/chunks/framework-5f4c69587bb7e3f0b3d9.js"
       as="script"
     />
     <link
       rel="preload"
-      href="/_next/static/chunks/597-1b9c2a3fa8cca5953f4e.js"
+      href="/_next/static/chunks/main-ffe9a79757f747d52ab7.js"
       as="script"
     />
     <link
       rel="preload"
-      href="/_next/static/chunks/778-7689030f4cd652c7d7fe.js"
+      href="/_next/static/chunks/pages/_app-a34876d2dde10c4d8851.js"
       as="script"
     />
     <link
       rel="preload"
-      href="/_next/static/chunks/main-9ca82ec4d4aca520c43d.js"
-      as="script"
-    />
-    <link
-      rel="preload"
-      href="/_next/static/chunks/pages/_app-5cc66b2123b5f30f6f03.js"
-      as="script"
-    />
-    <link
-      rel="preload"
-      href="/_next/static/chunks/pages/withRouter-186b16dd09ed427898bf.js"
+      href="/_next/static/chunks/pages/withRouter-1cc742358c254ca372dd.js"
       as="script"
     />
   </head>
@@ -55,34 +45,26 @@
     </script>
     <script
       nomodule=""
-      src="/_next/static/chunks/polyfills-8683bd742a84c1edd48c.js"
-    ></script>
-    <script
-      src="/_next/static/chunks/webpack-06f549fe60c32356e0c0.js"
-      async=""
-    ></script>
-    <script
-      src="/_next/static/chunks/framework-c77a2c3c8479e94a0d30.js"
-      async=""
+      src="/_next/static/chunks/polyfills-01e9caf46d9a7f038c09.js"
     ></script>
     <script
-      src="/_next/static/chunks/597-1b9c2a3fa8cca5953f4e.js"
+      src="/_next/static/chunks/webpack-dd6fffdf0dbc836f25a7.js"
       async=""
     ></script>
     <script
-      src="/_next/static/chunks/778-7689030f4cd652c7d7fe.js"
+      src="/_next/static/chunks/framework-5f4c69587bb7e3f0b3d9.js"
       async=""
     ></script>
     <script
-      src="/_next/static/chunks/main-9ca82ec4d4aca520c43d.js"
+      src="/_next/static/chunks/main-ffe9a79757f747d52ab7.js"
       async=""
     ></script>
     <script
-      src="/_next/static/chunks/pages/_app-5cc66b2123b5f30f6f03.js"
+      src="/_next/static/chunks/pages/_app-a34876d2dde10c4d8851.js"
       async=""
     ></script>
     <script
-      src="/_next/static/chunks/pages/withRouter-186b16dd09ed427898bf.js"
+      src="/_next/static/chunks/pages/withRouter-1cc742358c254ca372dd.js"
       async=""
     ></script>
     <script src="/_next/static/BUILD_ID/_buildManifest.js" async=""></script>

Serverless Mode (Increase detected ⚠️)

General Overall increase ⚠️

	vercel/next.js canary	vercel/next.js webpack/dependOn	Change
buildDuration	20.2s	19.4s	-860ms
buildDurationCached	7s	7.3s	⚠️ +298ms
nodeModulesSize	46.6 MB	46.6 MB	⚠️ +21.4 kB

Client Bundles (main, webpack, commons) Overall decrease ✓

	vercel/next.js canary	vercel/next.js webpack/dependOn	Change
597-HASH.js gzip	13.2 kB	N/A	N/A
778-HASH.js gzip	7.12 kB	N/A	N/A
framework-HASH.js gzip	39.3 kB	39.3 kB	✓
main-HASH.js gzip	151 B	19.3 kB	⚠️ +19.2 kB
webpack-HASH.js gzip	993 B	996 B	⚠️ +3 B
Overall change	60.8 kB	59.6 kB	-1.16 kB

Legacy Client Bundles (polyfills) Overall increase ⚠️

	vercel/next.js canary	vercel/next.js webpack/dependOn	Change
polyfills-HASH.js gzip	31.1 kB	31.1 kB	⚠️ +23 B
Overall change	31.1 kB	31.1 kB	⚠️ +23 B

Client Pages Overall decrease ✓

	vercel/next.js canary	vercel/next.js webpack/dependOn	Change
_app-HASH.js gzip	1.3 kB	1.02 kB	-279 B
_error-HASH.js gzip	3.68 kB	3.04 kB	-644 B
amp-HASH.js gzip	558 B	526 B	-32 B
css-HASH.js gzip	363 B	334 B	-29 B
hooks-HASH.js gzip	924 B	890 B	-34 B
index-HASH.js gzip	243 B	262 B	⚠️ +19 B
link-HASH.js gzip	1.66 kB	1.65 kB	-5 B
routerDirect..HASH.js gzip	336 B	331 B	-5 B
withRouter-HASH.js gzip	334 B	329 B	-5 B
99a142a5cfae..804.css gzip	125 B	125 B	✓
Overall change	9.52 kB	8.51 kB	-1.01 kB

Client Build Manifests Overall decrease ✓

	vercel/next.js canary	vercel/next.js webpack/dependOn	Change
_buildManifest.js gzip	395 B	393 B	-2 B
Overall change	395 B	393 B	-2 B

Serverless bundles Overall decrease ✓

	vercel/next.js canary	vercel/next.js webpack/dependOn	Change
_error.js	1.35 MB	1.34 MB	-792 B
404.html	2.76 kB	2.42 kB	-340 B
500.html	2.75 kB	2.41 kB	-340 B
amp.amp.html	10.8 kB	10.8 kB	✓
amp.html	1.96 kB	1.61 kB	-340 B
css.html	2.13 kB	1.79 kB	-340 B
hooks.html	2.01 kB	1.67 kB	-340 B
index.js	1.35 MB	1.34 MB	-792 B
link.js	1.4 MB	1.4 MB	-792 B
routerDirect.js	1.4 MB	1.39 MB	-792 B
withRouter.js	1.4 MB	1.39 MB	-790 B
Overall change	6.91 MB	6.9 MB	-5.66 kB

Webpack 4 Mode (Decrease detected ✓)

General Overall increase ⚠️

	vercel/next.js canary	vercel/next.js webpack/dependOn	Change
buildDuration	13.9s	13.5s	-417ms
buildDurationCached	5.6s	5.6s	-6ms
nodeModulesSize	46.6 MB	46.6 MB	⚠️ +21.4 kB

Page Load Tests Overall decrease ⚠️

	vercel/next.js canary	vercel/next.js webpack/dependOn	Change
/ failed reqs	0	0	✓
/ total time (seconds)	2.866	2.83	-0.04
/ avg req/sec	872.22	883.38	+11.16
/error-in-render failed reqs	0	0	✓
/error-in-render total time (seconds)	1.592	1.737	⚠️ +0.15
/error-in-render avg req/sec	1570.54	1439.56	⚠️ -130.98

Client Bundles (main, webpack, commons)

	vercel/next.js canary	vercel/next.js webpack/dependOn	Change
677f882d2ed8..HASH.js gzip	13.3 kB	13.3 kB	✓
framework.HASH.js gzip	39 kB	39 kB	✓
main-HASH.js gzip	7.19 kB	7.19 kB	✓
webpack-HASH.js gzip	751 B	751 B	✓
Overall change	60.2 kB	60.2 kB	✓

Legacy Client Bundles (polyfills)

	vercel/next.js canary	vercel/next.js webpack/dependOn	Change
polyfills-HASH.js gzip	31.3 kB	31.3 kB	✓
Overall change	31.3 kB	31.3 kB	✓

Client Pages

	vercel/next.js canary	vercel/next.js webpack/dependOn	Change
_app-HASH.js gzip	1.28 kB	1.28 kB	✓
_error-HASH.js gzip	3.71 kB	3.71 kB	✓
amp-HASH.js gzip	536 B	536 B	✓
css-HASH.js gzip	339 B	339 B	✓
hooks-HASH.js gzip	887 B	887 B	✓
index-HASH.js gzip	227 B	227 B	✓
link-HASH.js gzip	1.64 kB	1.64 kB	✓
routerDirect..HASH.js gzip	303 B	303 B	✓
withRouter-HASH.js gzip	302 B	302 B	✓
21c68fa65a48..217.css gzip	125 B	125 B	✓
Overall change	9.36 kB	9.36 kB	✓

Client Build Manifests

	vercel/next.js canary	vercel/next.js webpack/dependOn	Change
_buildManifest.js gzip	420 B	420 B	✓
Overall change	420 B	420 B	✓

Rendered Page Sizes

	vercel/next.js canary	vercel/next.js webpack/dependOn	Change
index.html gzip	613 B	613 B	✓
link.html gzip	620 B	620 B	✓
withRouter.html gzip	606 B	606 B	✓
Overall change	1.84 kB	1.84 kB	✓

Commit: 5abeb17

This fixes ie11 compatibility that broke in #24656 from the polyfills not being loaded first, our existing ie11 test caught this but was failing, this ensures the test is passing again. This also updates the `hrefValue` optional chaining in the eslint plugin as these files aren't transpiled and related tests were failing in azure ## Bug - [ ] Related issues linked using `fixes #number` - [ ] Integration tests added

* update webpack to 5.36.2 * use dependOn to optimize chunks * disable vendor splitting for main and _app chunks => decreases bundle size in general, gets rid of the 2 extra vendor chunks shared by all pages. ## Bug - [ ] Related issues linked using `fixes #number` - [ ] Integration tests added ## Feature - [ ] Implements an existing feature request or RFC. Make sure the feature request has been accepted for implementation before opening a PR. - [ ] Related issues linked using `fixes #number` - [ ] Integration tests added - [ ] Documentation added - [ ] Telemetry added. In case of a feature if it's used or not. ## Documentation / Examples - [ ] Make sure the linting passes

This fixes ie11 compatibility that broke in vercel#24656 from the polyfills not being loaded first, our existing ie11 test caught this but was failing, this ensures the test is passing again. This also updates the `hrefValue` optional chaining in the eslint plugin as these files aren't transpiled and related tests were failing in azure ## Bug - [ ] Related issues linked using `fixes #number` - [ ] Integration tests added

update webpack to 5.36.2

67206a6

ijjk added the type: next label Apr 30, 2021

sokra force-pushed the webpack/dependOn branch from 1aa3207 to 390c213 Compare April 30, 2021 13:30

This comment has been minimized.

Sign in to view

sokra force-pushed the webpack/dependOn branch from 390c213 to 2003e9b Compare April 30, 2021 14:27

This comment has been minimized.

Sign in to view

use dependOn to optimize chunks

2eba039

disable vendor splitting for main and _app chunks

sokra force-pushed the webpack/dependOn branch from 2003e9b to 2eba039 Compare May 1, 2021 17:18

This comment has been minimized.

Sign in to view

sokra marked this pull request as ready for review May 1, 2021 17:55

sokra requested review from divmain, ijjk, lfades, shuding and timneutkens as code owners May 1, 2021 17:55

Merge branch 'canary' into webpack/dependOn

d83acf1

This comment has been minimized.

Sign in to view

update test snapshots

5abeb17

timneutkens approved these changes May 3, 2021

View reviewed changes

kodiakhq bot merged commit 1d643eb into canary May 3, 2021

kodiakhq bot deleted the webpack/dependOn branch May 3, 2021 10:25

ijjk mentioned this pull request May 12, 2021

Fix ie11 support with webpack 5 #25014

Merged

2 tasks

vercel locked as resolved and limited conversation to collaborators Jan 28, 2022

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

update webpack to 5.36.2, use dependOn #24656

update webpack to 5.36.2, use dependOn #24656

sokra commented Apr 30, 2021 •

edited

Loading

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

ijjk commented May 1, 2021

Diffs

update webpack to 5.36.2, use dependOn #24656

update webpack to 5.36.2, use dependOn #24656

Conversation

sokra commented Apr 30, 2021 • edited Loading

Bug

Feature

Documentation / Examples

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

ijjk commented May 1, 2021

Stats from current PR

Diffs

sokra commented Apr 30, 2021 •

edited

Loading