Stats from current release

ijjk · 2022-04-11T22:28:41Z

Stats from current release

Default Build (Increase detected ⚠️)

General Overall increase ⚠️

	vercel/next.js canary v12.1.4	vercel/next.js refs/heads/canary	Change
buildDuration	18.5s	17.9s	-626ms
buildDurationCached	7.3s	7.4s	⚠️ +173ms
nodeModulesSize	86.6 MB	86.7 MB	⚠️ +51.7 kB

Page Load Tests Overall increase ✓

	vercel/next.js canary v12.1.4	vercel/next.js refs/heads/canary	Change
/ failed reqs	0	0	✓
/ total time (seconds)	4.149	4.133	-0.02
/ avg req/sec	602.6	604.85	+2.25
/error-in-render failed reqs	0	0	✓
/error-in-render total time (seconds)	2.08	2.031	-0.05
/error-in-render avg req/sec	1201.72	1230.65	+28.93

Client Bundles (main, webpack) Overall decrease ✓

	vercel/next.js canary v12.1.4	vercel/next.js refs/heads/canary	Change
925.HASH.js gzip	179 B	179 B	✓
framework-HASH.js gzip	42 kB	42 kB	✓
main-HASH.js gzip	28.4 kB	28 kB	-415 B
webpack-HASH.js gzip	1.44 kB	1.44 kB	✓
Overall change	72.1 kB	71.7 kB	-415 B

Legacy Client Bundles (polyfills)

	vercel/next.js canary v12.1.4	vercel/next.js refs/heads/canary	Change
polyfills-HASH.js gzip	31 kB	31 kB	✓
Overall change	31 kB	31 kB	✓

Client Pages Overall increase ⚠️

	vercel/next.js canary v12.1.4	vercel/next.js refs/heads/canary	Change
_app-HASH.js gzip	1.36 kB	1.36 kB	✓
_error-HASH.js gzip	192 B	192 B	✓
amp-HASH.js gzip	309 B	309 B	✓
css-HASH.js gzip	327 B	327 B	✓
dynamic-HASH.js gzip	3.05 kB	3.05 kB	✓
head-HASH.js gzip	351 B	351 B	✓
hooks-HASH.js gzip	920 B	920 B	✓
image-HASH.js gzip	5.48 kB	5.68 kB	⚠️ +199 B
index-HASH.js gzip	263 B	263 B	✓
link-HASH.js gzip	2.26 kB	2.32 kB	⚠️ +58 B
routerDirect..HASH.js gzip	320 B	320 B	✓
script-HASH.js gzip	387 B	387 B	✓
withRouter-HASH.js gzip	319 B	319 B	✓
85e02e95b279..7e3.css gzip	107 B	107 B	✓
Overall change	15.7 kB	15.9 kB	⚠️ +257 B

Client Build Manifests

	vercel/next.js canary v12.1.4	vercel/next.js refs/heads/canary	Change
_buildManifest.js gzip	460 B	460 B	✓
Overall change	460 B	460 B	✓

Rendered Page Sizes Overall increase ⚠️

	vercel/next.js canary v12.1.4	vercel/next.js refs/heads/canary	Change
index.html gzip	531 B	532 B	⚠️ +1 B
link.html gzip	545 B	546 B	⚠️ +1 B
withRouter.html gzip	525 B	526 B	⚠️ +1 B
Overall change	1.6 kB	1.6 kB	⚠️ +3 B

Diffs

Diff for _buildManifest.js

@@ -12,8 +12,8 @@ self.__BUILD_MANIFEST = {
   ],
   "/head": ["static\u002Fchunks\u002Fpages\u002Fhead-96a5d6ed07cf5a83.js"],
   "/hooks": ["static\u002Fchunks\u002Fpages\u002Fhooks-9dfe734f583d4926.js"],
-  "/image": ["static\u002Fchunks\u002Fpages\u002Fimage-fceff8aa5864bcb2.js"],
-  "/link": ["static\u002Fchunks\u002Fpages\u002Flink-a96e4060bca1ccfe.js"],
+  "/image": ["static\u002Fchunks\u002Fpages\u002Fimage-0e5a6c840e535a1d.js"],
+  "/link": ["static\u002Fchunks\u002Fpages\u002Flink-a72b8ab130103a8f.js"],
   "/routerDirect": [
     "static\u002Fchunks\u002Fpages\u002FrouterDirect-cb15c8ac2322bf32.js"
   ],

Diff for image-HASH.js

@@ -154,8 +154,7 @@
           objectFit = _param.objectFit,
           objectPosition = _param.objectPosition,
           onLoadingComplete = _param.onLoadingComplete,
-          _loader = _param.loader,
-          loader = _loader === void 0 ? defaultImageLoader : _loader,
+          onError = _param.onError,
           _placeholder = _param.placeholder,
           placeholder = _placeholder === void 0 ? "empty" : _placeholder,
           blurDataURL = _param.blurDataURL,
@@ -175,7 +174,7 @@
             "objectFit",
             "objectPosition",
             "onLoadingComplete",
-            "loader",
+            "onError",
             "placeholder",
             "blurDataURL"
           ]);
@@ -206,8 +205,26 @@
         if ("layout" in rest) {
           // Override default layout if the user specified one:
           if (rest.layout) layout = rest.layout;
-          // Remove property so it's not spread into image:
-          delete rest["layout"];
+          // Remove property so it's not spread on <img>:
+          delete rest.layout;
+        }
+        var loader = defaultImageLoader;
+        if ("loader" in rest) {
+          if (rest.loader) {
+            var customImageLoader = rest.loader;
+            var _tmp;
+            (_tmp = function(obj) {
+              var _ = obj.config,
+                opts = _objectWithoutProperties(obj, ["config"]);
+              // The config object is internal only so we must
+              // not pass it to the user-defined loader()
+              return customImageLoader(opts);
+            }),
+              (loader = _tmp),
+              _tmp;
+          }
+          // Remove property so it's not spread on <img>
+          delete rest.loader;
         }
         var staticSrc = "";
         if (isStaticImport(src)) {
@@ -247,16 +264,20 @@
         if (true && loadedImageURLs.has(src)) {
           isLazy = false;
         }
+        var ref2 = _slicedToArray((0, _react).useState(false), 2),
+          blurComplete = ref2[0],
+          setBlurComplete = ref2[1];
         var ref1 = _slicedToArray(
             (0, _useIntersection).useIntersection({
               rootRef: lazyRoot,
               rootMargin: lazyBoundary,
               disabled: !isLazy
             }),
-            2
+            3
           ),
           setIntersection = ref1[0],
-          isIntersected = ref1[1];
+          isIntersected = ref1[1],
+          resetIntersected = ref1[2];
         var isVisible = !isLazy || isIntersected;
         var wrapperStyle = {
           boxSizing: "border-box",
@@ -318,7 +339,7 @@
             : layoutStyle
         );
         var blurStyle =
-          placeholder === "blur"
+          placeholder === "blur" && !blurComplete
             ? {
                 filter: "blur(20px)",
                 backgroundSize: objectFit || "cover",
@@ -404,7 +425,7 @@
           _obj);
         var useLayoutEffect = false ? 0 : _react.default.useLayoutEffect;
         var onLoadingCompleteRef = (0, _react).useRef(onLoadingComplete);
-        var imgRef = (0, _react).useRef(null);
+        var previousImageSrc = (0, _react).useRef(src);
         (0, _react).useEffect(
           function() {
             onLoadingCompleteRef.current = onLoadingComplete;
@@ -413,21 +434,12 @@
         );
         useLayoutEffect(
           function() {
-            setIntersection(imgRef.current);
-          },
-          [setIntersection]
-        );
-        (0, _react).useEffect(
-          function() {
-            handleLoading(
-              imgRef,
-              srcString,
-              layout,
-              placeholder,
-              onLoadingCompleteRef
-            );
+            if (previousImageSrc.current !== src) {
+              resetIntersected();
+              previousImageSrc.current = src;
+            }
           },
-          [srcString, layout, placeholder, isVisible]
+          [resetIntersected, src]
         );
         var imgElementArgs = _objectSpread(
           {
@@ -440,13 +452,16 @@
             className: className,
             imgStyle: imgStyle,
             blurStyle: blurStyle,
-            imgRef: imgRef,
             loading: loading,
             config: config,
             unoptimized: unoptimized,
             placeholder: placeholder,
             loader: loader,
-            srcString: srcString
+            srcString: srcString,
+            onLoadingCompleteRef: onLoadingCompleteRef,
+            setBlurComplete: setBlurComplete,
+            setIntersection: setIntersection,
+            isVisible: isVisible
           },
           rest
         );
@@ -752,9 +767,9 @@
             sizes: undefined
           };
         }
-        var ref2 = getWidths(config, width, layout, sizes),
-          widths = ref2.widths,
-          kind = ref2.kind;
+        var ref3 = getWidths(config, width, layout, sizes),
+          widths = ref3.widths,
+          kind = ref3.kind;
         var last = widths.length - 1;
         return {
           sizes: !sizes && kind === "w" ? "100vw" : sizes,
@@ -816,56 +831,53 @@
       // See https://stackoverflow.com/q/39777833/266535 for why we use this ref
       // handler instead of the img's onLoad attribute.
       function handleLoading(
-        imgRef,
+        img,
         src,
         layout,
         placeholder,
-        onLoadingCompleteRef
+        onLoadingCompleteRef,
+        setBlurComplete
       ) {
-        var handleLoad = function() {
-          var img = imgRef.current;
-          if (!img) {
+        if (
+          !img ||
+          img.src === emptyDataURL ||
+          img["data-loaded-src"] === src
+        ) {
+          return;
+        }
+        img["data-loaded-src"] = src;
+        var p = "decode" in img ? img.decode() : Promise.resolve();
+        p.catch(function() {}).then(function() {
+          if (!img.parentNode) {
+            // Exit early in case of race condition:
+            // - onload() is called
+            // - decode() is called but incomplete
+            // - unmount is called
+            // - decode() completes
             return;
           }
-          if (img.src !== emptyDataURL) {
-            var p = "decode" in img ? img.decode() : Promise.resolve();
-            p.catch(function() {}).then(function() {
-              if (!imgRef.current) {
-                return;
-              }
-              loadedImageURLs.add(src);
-              if (placeholder === "blur") {
-                img.style.filter = "";
-                img.style.backgroundSize = "";
-                img.style.backgroundImage = "";
-                img.style.backgroundPosition = "";
-              }
-              if (onLoadingCompleteRef.current) {
-                var naturalWidth = img.naturalWidth,
-                  naturalHeight = img.naturalHeight;
-                // Pass back read-only primitive values but not the
-                // underlying DOM element because it could be misused.
-                onLoadingCompleteRef.current({
-                  naturalWidth: naturalWidth,
-                  naturalHeight: naturalHeight
-                });
-              }
-              if (false) {
-                var parent, ref3;
-              }
+          loadedImageURLs.add(src);
+          if (placeholder === "blur") {
+            setBlurComplete(true);
+          }
+          if (
+            onLoadingCompleteRef === null || onLoadingCompleteRef === void 0
+              ? void 0
+              : onLoadingCompleteRef.current
+          ) {
+            var naturalWidth = img.naturalWidth,
+              naturalHeight = img.naturalHeight;
+            // Pass back read-only primitive values but not the
+            // underlying DOM element because it could be misused.
+            onLoadingCompleteRef.current({
+              naturalWidth: naturalWidth,
+              naturalHeight: naturalHeight
             });
           }
-        };
-        if (imgRef.current) {
-          if (imgRef.current.complete) {
-            // If the real image fails to load, this will still remove the placeholder.
-            // This is the desired behavior for now, and will be revisited when error
-            // handling is worked on for the image component itself.
-            handleLoad();
-          } else {
-            imgRef.current.onload = handleLoad;
+          if (false) {
+            var parent, ref3;
           }
-        }
+        });
       }
       var ImageElement = function(_param) {
         var imgAttributes = _param.imgAttributes,
@@ -877,14 +889,17 @@
           imgStyle = _param.imgStyle,
           blurStyle = _param.blurStyle,
           isLazy = _param.isLazy,
-          imgRef = _param.imgRef,
           placeholder = _param.placeholder,
           loading = _param.loading,
-          sizes = _param.sizes,
           srcString = _param.srcString,
           config = _param.config,
           unoptimized = _param.unoptimized,
           loader = _param.loader,
+          onLoadingCompleteRef = _param.onLoadingCompleteRef,
+          setBlurComplete = _param.setBlurComplete,
+          setIntersection = _param.setIntersection,
+          onError = _param.onError,
+          isVisible = _param.isVisible,
           rest = _objectWithoutProperties(_param, [
             "imgAttributes",
             "heightInt",
@@ -895,14 +910,17 @@
             "imgStyle",
             "blurStyle",
             "isLazy",
-            "imgRef",
             "placeholder",
             "loading",
-            "sizes",
             "srcString",
             "config",
             "unoptimized",
-            "loader"
+            "loader",
+            "onLoadingCompleteRef",
+            "setBlurComplete",
+            "setIntersection",
+            "onError",
+            "isVisible"
           ]);
         return /*#__PURE__*/ _react.default.createElement(
           _react.default.Fragment,
@@ -913,7 +931,7 @@
               {},
               rest,
               imgAttributes,
-              layout === "raw" && !sizes
+              layout === "raw" && !imgAttributes.sizes
                 ? {
                     height: heightInt,
                     width: widthInt
@@ -923,8 +941,52 @@
                 decoding: "async",
                 "data-nimg": layout,
                 className: className,
-                ref: imgRef,
-                style: _objectSpread({}, imgStyle, blurStyle)
+                style: _objectSpread({}, imgStyle, blurStyle),
+                ref: (0, _react).useCallback(
+                  function(img) {
+                    setIntersection(img);
+                    if (
+                      img === null || img === void 0 ? void 0 : img.complete
+                    ) {
+                      handleLoading(
+                        img,
+                        srcString,
+                        layout,
+                        placeholder,
+                        onLoadingCompleteRef,
+                        setBlurComplete
+                      );
+                    }
+                  },
+                  [
+                    setIntersection,
+                    srcString,
+                    layout,
+                    placeholder,
+                    onLoadingCompleteRef,
+                    setBlurComplete
+                  ]
+                ),
+                onLoad: function(event) {
+                  var img = event.currentTarget;
+                  handleLoading(
+                    img,
+                    srcString,
+                    layout,
+                    placeholder,
+                    onLoadingCompleteRef,
+                    setBlurComplete
+                  );
+                },
+                onError: function(event) {
+                  if (placeholder === "blur") {
+                    // If the real image fails to load, this will still remove the placeholder.
+                    setBlurComplete(true);
+                  }
+                  if (onError) {
+                    onError(event);
+                  }
+                }
               }
             )
           ),
@@ -944,10 +1006,10 @@
                     layout: layout,
                     width: widthInt,
                     quality: qualityInt,
-                    sizes: sizes,
+                    sizes: imgAttributes.sizes,
                     loader: loader
                   }),
-                  layout === "raw" && !sizes
+                  layout === "raw" && !imgAttributes.sizes
                     ? {
                         height: heightInt,
                         width: widthInt
@@ -1159,6 +1221,9 @@
           },
           [isDisabled, root, rootMargin, visible]
         );
+        var resetVisible = (0, _react).useCallback(function() {
+          setVisible(false);
+        }, []);
         (0, _react).useEffect(
           function() {
             if (!hasIntersectionObserver) {
@@ -1183,7 +1248,7 @@
           },
           [rootRef]
         );
-        return [setRef, visible];
+        return [setRef, visible, resetVisible];
       }
       function observe(element, callback, options) {
         var ref = createObserver(options),

Diff for link-HASH.js

@@ -198,6 +198,8 @@
           ),
           href = ref2.href,
           as = ref2.as;
+        var previousHref = _react.default.useRef(href);
+        var previousAs = _react.default.useRef(as);
         var children = props.children,
           replace = props.replace,
           shallow = props.shallow,
@@ -221,12 +223,19 @@
             (0, _useIntersection).useIntersection({
               rootMargin: "200px"
             }),
-            2
+            3
           ),
           setIntersectionRef = ref1[0],
-          isVisible = ref1[1];
+          isVisible = ref1[1],
+          resetVisible = ref1[2];
         var setRef = _react.default.useCallback(
           function(el) {
+            // Before the link getting observed, check if visible state need to be reset
+            if (previousAs.current !== as || previousHref.current !== href) {
+              resetVisible();
+              previousAs.current = as;
+              previousHref.current = href;
+            }
             setIntersectionRef(el);
             if (childRef) {
               if (typeof childRef === "function") childRef(el);
@@ -235,7 +244,7 @@
               }
             }
           },
-          [childRef, setIntersectionRef]
+          [as, childRef, href, resetVisible, setIntersectionRef]
         );
         _react.default.useEffect(
           function() {
@@ -434,6 +443,9 @@
           },
           [isDisabled, root, rootMargin, visible]
         );
+        var resetVisible = (0, _react).useCallback(function() {
+          setVisible(false);
+        }, []);
         (0, _react).useEffect(
           function() {
             if (!hasIntersectionObserver) {
@@ -458,7 +470,7 @@
           },
           [rootRef]
         );
-        return [setRef, visible];
+        return [setRef, visible, resetVisible];
       }
       function observe(element, callback, options) {
         var ref = createObserver(options),

Diff for main-HASH.js

@@ -473,7 +473,7 @@
       var _routeAnnouncer = __webpack_require__(8483);
       var _router1 = __webpack_require__(880);
       var _isError = __webpack_require__(676);
-      var _vitals = __webpack_require__(4564);
+      var _vitals = __webpack_require__(7185);
       var _refresh = __webpack_require__(2129);
       var _imageConfigContext = __webpack_require__(8730);
       function asyncGeneratorStep(
@@ -624,7 +624,7 @@
         }
         return target;
       }
-      var version = "12.1.4";
+      var version = "12.1.5-canary.6";
       exports.version = version;
       var router;
       exports.router = router;
@@ -643,7 +643,7 @@
       var webpackHMR;
       var CachedApp, onPerfEntry;
       var CachedComponent;
-      var isAppRSC;
+      var isRSCPage;
       var Container = /*#__PURE__*/ (function(_Component) {
         _inherits(Container, _Component);
         var _super = _createSuper(Container);
@@ -868,7 +868,6 @@
                       (app = appEntrypoint.component),
                         (mod = appEntrypoint.exports);
                       CachedApp = app;
-                      isAppRSC = !!mod.__next_rsc__;
                       exportedReportWebVitals = mod && mod.reportWebVitals;
                       onPerfEntry = function(param) {
                         var id = param.id,
@@ -909,30 +908,31 @@
                         // error, so we need to skip waiting for the entrypoint.
                         true
                       ) {
-                        _ctx.next = 16;
+                        _ctx.next = 15;
                         break;
                       }
                       _ctx.t0 = {
                         error: initialData.err
                       };
-                      _ctx.next = 19;
-                      break;
-                    case 16:
                       _ctx.next = 18;
+                      break;
+                    case 15:
+                      _ctx.next = 17;
                       return pageLoader.routeLoader.whenEntrypoint(
                         initialData.page
                       );
-                    case 18:
+                    case 17:
                       _ctx.t0 = _ctx.sent;
-                    case 19:
+                    case 18:
                       pageEntrypoint = _ctx.t0;
                       if (!("error" in pageEntrypoint)) {
-                        _ctx.next = 22;
+                        _ctx.next = 21;
                         break;
                       }
                       throw pageEntrypoint.error;
-                    case 22:
+                    case 21:
                       CachedComponent = pageEntrypoint.component;
+                      isRSCPage = !!pageEntrypoint.exports.__next_rsc__;
                       if (true) {
                         _ctx.next = 27;
                         break;
@@ -1177,7 +1177,7 @@
           shouldHydrate ? markHydrateComplete : markRenderComplete
         );
         if (false) {
-          var ReactDOMClient;
+          var startTransition, ReactDOMClient;
         } else {
           // The check for `.hydrate` is there to support React alternatives like preact
           if (shouldHydrate) {
@@ -1318,7 +1318,9 @@
           initialServerDataWriter,
           initialServerDataBuffer,
           encoder,
+          ref1,
           createFromFetch,
+          createFromReadableStream,
           getCacheKey,
           useServerResponse,
           fetchFlight,
@@ -1505,14 +1507,14 @@
           },
           [callbacks]
         );
-        if (false) {
-        }
         // 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);
           (0, _vitals).flushBufferedVitalsMetrics();
         }, []);
+        if (false) {
+        }
         return children;
       }
       // Dummy component that we render as a child of Root so that we can
@@ -1679,7 +1681,7 @@
               var href = param.href,
                 asPath = param.asPath,
                 ssg = param.ssg,
-                rsc = param.rsc,
+                flight = param.flight,
                 locale = param.locale;
               var _this = this;
               var ref = (0, _parseRelativeUrl).parseRelativeUrl(href),
@@ -1690,7 +1692,7 @@
                 asPathname = ref1.pathname;
               var route = normalizeRoute(hrefPathname);
               var getHrefForSlug = function(path) {
-                if (rsc) {
+                if (flight) {
                   return path + search + (search ? "&" : "?") + "__flight__=1";
                 }
                 var dataRoute = (0, _getAssetPathFromRoute).default(
@@ -3197,7 +3199,7 @@
       /***/
     },
 
-    /***/ 4564: /***/ function(
+    /***/ 7185: /***/ function(
       __unused_webpack_module,
       exports,
       __webpack_require__
@@ -4351,8 +4353,8 @@
       var _resolveRewrites = _interopRequireDefault1(__webpack_require__(2431));
       var _routeMatcher = __webpack_require__(3156);
       var _routeRegex = __webpack_require__(4903);
+      var _getMiddlewareRegex = __webpack_require__(3072);
       var _formatUrl = __webpack_require__(7795);
-      var _routingItems = __webpack_require__(7185);
       function _interopRequireDefault1(obj) {
         return obj && obj.__esModule
           ? obj
@@ -4404,6 +4406,10 @@
           ) + path.slice(pathname.length)
         );
       }
+      function hasPathPrefix(path, prefix) {
+        path = pathNoQueryHash(path);
+        return path === prefix || path.startsWith(prefix + "/");
+      }
       function getDomainLocale(path, locale, locales, domainLocales) {
         if (false) {
           var detectedDomain;
@@ -4432,8 +4438,7 @@
         return path;
       }
       function hasBasePath(path) {
-        path = pathNoQueryHash(path);
-        return path === basePath || path.startsWith(basePath + "/");
+        return hasPathPrefix(path, basePath);
       }
       function addBasePath(path) {
         // we only add the basepath on relative urls
@@ -5869,10 +5874,10 @@
                     __N_RSC,
                     isValidElementType,
                     dataHref,
+                    useStreamedFlightData,
                     props,
-                    ref,
-                    fresh,
-                    data;
+                    data,
+                    __flight__;
                   return _runtimeJs.default.wrap(
                     function _callee$(_ctx) {
                       while (1)
@@ -5951,6 +5956,8 @@
                               )
                             );
                           case 17:
+                            useStreamedFlightData =
+                              (false || __N_SSP) && __N_RSC;
                             if (__N_SSG || __N_SSP || __N_RSC) {
                               dataHref = _this.pageLoader.getDataHref({
                                 href: (0, _formatUrl).formatWithValidation({
@@ -5959,13 +5966,14 @@
                                 }),
                                 asPath: resolvedAs,
                                 ssg: __N_SSG,
-                                rsc: __N_RSC,
+                                flight: useStreamedFlightData,
                                 locale: locale
                               });
                             }
-                            _ctx.next = 21;
+                            _ctx.next = 22;
                             return _this._getData(function() {
-                              return __N_SSG || __N_SSP
+                              return (__N_SSG || __N_SSP || __N_RSC) &&
+                                !useStreamedFlightData
                                 ? fetchNextData(
                                     dataHref,
                                     _this.isSsr,
@@ -5982,30 +5990,43 @@
                                     defaultLocale: _this.defaultLocale
                                   });
                             });
-                          case 21:
+                          case 22:
                             props = _ctx.sent;
                             if (!__N_RSC) {
-                              _ctx.next = 29;
+                              _ctx.next = 32;
                               break;
                             }
-                            _ctx.next = 25;
+                            if (!useStreamedFlightData) {
+                              _ctx.next = 31;
+                              break;
+                            }
+                            _ctx.next = 27;
                             return _this._getData(function() {
                               return _this._getFlightData(dataHref);
                             });
-                          case 25:
-                            ref = _ctx.sent;
-                            fresh = ref.fresh;
-                            data = ref.data;
+                          case 27:
+                            data = _ctx.sent.data;
                             props.pageProps = Object.assign(props.pageProps, {
-                              __flight_serialized__: data,
-                              __flight_fresh__: fresh
+                              __flight__: data
                             });
-                          case 29:
+                            _ctx.next = 32;
+                            break;
+                          case 31: {
+                            __flight__ = props.__flight__;
+                            props.pageProps = Object.assign(
+                              {},
+                              props.pageProps,
+                              {
+                                __flight__: __flight__
+                              }
+                            );
+                          }
+                          case 32:
                             routeInfo.props = props;
                             _this.components[route] = routeInfo;
                             return _ctx.abrupt("return", routeInfo);
-                          case 34:
-                            _ctx.prev = 34;
+                          case 37:
+                            _ctx.prev = 37;
                             _ctx.t1 = _ctx["catch"](0);
                             return _ctx.abrupt(
                               "return",
@@ -6017,14 +6038,14 @@
                                 routeProps
                               )
                             );
-                          case 37:
+                          case 40:
                           case "end":
                             return _ctx.stop();
                         }
                     },
                     _callee,
                     null,
-                    [[0, 34]]
+                    [[0, 37]]
                   );
                 })
               )();
@@ -6363,7 +6384,6 @@
               return fetchNextData(dataHref, true, true, this.sdc, false).then(
                 function(serialized) {
                   return {
-                    fresh: true,
                     data: serialized
                   };
                 }
@@ -6378,16 +6398,9 @@
                 _runtimeJs.default.mark(function _callee() {
                   var asPathname,
                     cleanedAs,
-                    middlewareList,
-                    middleware,
-                    routingItems,
+                    fns,
                     requiresPreflight,
-                    _iteratorNormalCompletion,
-                    _didIteratorError,
-                    _iteratorError,
-                    _iterator,
-                    _step,
-                    item,
+                    preflightHref,
                     preflight,
                     parsed,
                     fsPathname,
@@ -6412,116 +6425,62 @@
                             _ctx.next = 4;
                             return _this.pageLoader.getMiddlewareList();
                           case 4:
-                            middlewareList = _ctx.sent;
-                            middleware = middlewareList.map(function(param) {
+                            fns = _ctx.sent;
+                            requiresPreflight = fns.some(function(param) {
                               var _param = _slicedToArray(param, 2),
-                                page = _param[0],
-                                ssr = _param[1];
-                              return {
-                                page: page,
-                                ssr: ssr
-                              };
+                                middleware = _param[0],
+                                isSSR = _param[1];
+                              return (0, _routeMatcher).getRouteMatcher(
+                                (0, _getMiddlewareRegex).getMiddlewareRegex(
+                                  middleware,
+                                  !isSSR
+                                )
+                              )(cleanedAs);
                             });
-                            routingItems = (0, _routingItems).getRoutingItems(
-                              options.pages,
-                              middleware
-                            );
-                            requiresPreflight = false;
-                            (_iteratorNormalCompletion = true),
-                              (_didIteratorError = false),
-                              (_iteratorError = undefined);
-                            _ctx.prev = 9;
-                            _iterator = routingItems[Symbol.iterator]();
-                          case 11:
-                            if (
-                              (_iteratorNormalCompletion = (_step = _iterator.next())
-                                .done)
-                            ) {
-                              _ctx.next = 19;
-                              break;
-                            }
-                            item = _step.value;
-                            if (!item.match(cleanedAs)) {
-                              _ctx.next = 16;
-                              break;
-                            }
-                            if (item.isMiddleware) {
-                              requiresPreflight = true;
-                            }
-                            return _ctx.abrupt("break", 19);
-                          case 16:
-                            _iteratorNormalCompletion = true;
-                            _ctx.next = 11;
-                            break;
-                          case 19:
-                            _ctx.next = 25;
-                            break;
-                          case 21:
-                            _ctx.prev = 21;
-                            _ctx.t0 = _ctx["catch"](9);
-                            _didIteratorError = true;
-                            _iteratorError = _ctx.t0;
-                          case 25:
-                            _ctx.prev = 25;
-                            _ctx.prev = 26;
-                            if (
-                              !_iteratorNormalCompletion &&
-                              _iterator.return != null
-                            ) {
-                              _iterator.return();
-                            }
-                          case 28:
-                            _ctx.prev = 28;
-                            if (!_didIteratorError) {
-                              _ctx.next = 31;
-                              break;
-                            }
-                            throw _iteratorError;
-                          case 31:
-                            return _ctx.finish(28);
-                          case 32:
-                            return _ctx.finish(25);
-                          case 33:
                             if (requiresPreflight) {
-                              _ctx.next = 35;
+                              _ctx.next = 8;
                               break;
                             }
                             return _ctx.abrupt("return", {
                               type: "next"
                             });
-                          case 35:
-                            _ctx.prev = 36;
-                            _ctx.next = 39;
+                          case 8:
+                            preflightHref = addLocale(
+                              options.as,
+                              options.locale
+                            );
+                            _ctx.prev = 10;
+                            _ctx.next = 13;
                             return _this._getPreflightData({
-                              preflightHref: options.as,
+                              preflightHref: preflightHref,
                               shouldCache: options.cache,
                               isPreview: options.isPreview
                             });
-                          case 39:
+                          case 13:
                             preflight = _ctx.sent;
-                            _ctx.next = 45;
+                            _ctx.next = 19;
                             break;
-                          case 42:
-                            _ctx.prev = 42;
-                            _ctx.t1 = _ctx["catch"](36);
+                          case 16:
+                            _ctx.prev = 16;
+                            _ctx.t0 = _ctx["catch"](10);
                             return _ctx.abrupt("return", {
                               type: "redirect",
                               destination: options.as
                             });
-                          case 45:
+                          case 19:
                             if (!preflight.rewrite) {
-                              _ctx.next = 54;
+                              _ctx.next = 28;
                               break;
                             }
                             if (preflight.rewrite.startsWith("/")) {
-                              _ctx.next = 48;
+                              _ctx.next = 22;
                               break;
                             }
                             return _ctx.abrupt("return", {
                               type: "redirect",
                               destination: options.as
                             });
-                          case 48:
+                          case 22:
                             parsed = (0, _parseRelativeUrl).parseRelativeUrl(
                               (0, _normalizeLocalePath).normalizeLocalePath(
                                 hasBasePath(preflight.rewrite)
@@ -6556,13 +6515,13 @@
                               matchedPage: matchedPage,
                               resolvedHref: resolvedHref
                             });
-                          case 54:
+                          case 28:
                             if (!preflight.redirect) {
-                              _ctx.next = 60;
+                              _ctx.next = 34;
                               break;
                             }
                             if (!preflight.redirect.startsWith("/")) {
-                              _ctx.next = 59;
+                              _ctx.next = 33;
                               break;
                             }
                             cleanRedirect = (0,
@@ -6586,35 +6545,31 @@
                               newUrl: newUrl,
                               newAs: newAs
                             });
-                          case 59:
+                          case 33:
                             return _ctx.abrupt("return", {
                               type: "redirect",
                               destination: preflight.redirect
                             });
-                          case 60:
+                          case 34:
                             if (!(preflight.refresh && !preflight.ssr)) {
-                              _ctx.next = 62;
+                              _ctx.next = 36;
                               break;
                             }
                             return _ctx.abrupt("return", {
                               type: "refresh"
                             });
-                          case 62:
+                          case 36:
                             return _ctx.abrupt("return", {
                               type: "next"
                             });
-                          case 63:
+                          case 37:
                           case "end":
                             return _ctx.stop();
                         }
                     },
                     _callee,
                     null,
-                    [
-                      [9, 21, 25, 33],
-                      [26, , 28, 32],
-                      [36, 42]
-                    ]
+                    [[10, 16]]
                   );
                 })
               )();
@@ -6886,17 +6841,11 @@
       });
       exports.getMiddlewareRegex = getMiddlewareRegex;
       var _routeRegex = __webpack_require__(4903);
-      // Identify ^/[param]/ in route string
-      var FIRST_SEGMENT_DYNAMIC = /^\/\[[^/]+?\](?=\/|$)/;
-      var NOT_API_ROUTE = "(?!/api(?:/|$))";
       function getMiddlewareRegex(normalizedRoute) {
         var catchAll =
           arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : true;
         var result = (0, _routeRegex).getParametrizedRoute(normalizedRoute);
-        var notApiRegex = FIRST_SEGMENT_DYNAMIC.test(normalizedRoute)
-          ? NOT_API_ROUTE
-          : "";
-        var catchAllRegex = catchAll ? "(?!_next($|/)).*" : "";
+        var catchAllRegex = catchAll ? "(?!_next).*" : "";
         var catchAllGroupedRegex = catchAll ? "(?:(/.*)?)" : "";
         if ("routeKeys" in result) {
           if (result.parameterizedRoute === "/") {
@@ -6910,12 +6859,10 @@
           return {
             groups: result.groups,
             namedRegex: "^"
-              .concat(notApiRegex)
               .concat(result.namedParameterizedRoute)
               .concat(catchAllGroupedRegex, "$"),
             re: new RegExp(
               "^"
-                .concat(notApiRegex)
                 .concat(result.parameterizedRoute)
                 .concat(catchAllGroupedRegex, "$")
             ),
@@ -6932,7 +6879,6 @@
           groups: {},
           re: new RegExp(
             "^"
-              .concat(notApiRegex)
               .concat(result.parameterizedRoute)
               .concat(catchAllGroupedRegex, "$")
           )
@@ -6970,18 +6916,6 @@
           return _routeRegex.getRouteRegex;
         }
       });
-      Object.defineProperty(exports, "getRoutingItems", {
-        enumerable: true,
-        get: function get() {
-          return _routingItems.getRoutingItems;
-        }
-      });
-      Object.defineProperty(exports, "RoutingItem", {
-        enumerable: true,
-        get: function get() {
-          return _routingItems.RoutingItem;
-        }
-      });
       Object.defineProperty(exports, "getSortedRoutes", {
         enumerable: true,
         get: function get() {
@@ -6997,7 +6931,6 @@
       var _getMiddlewareRegex = __webpack_require__(3072);
       var _routeMatcher = __webpack_require__(3156);
       var _routeRegex = __webpack_require__(4903);
-      var _routingItems = __webpack_require__(7185);
       var _sortedRoutes = __webpack_require__(566);
       var _isDynamic = __webpack_require__(6238); //# sourceMappingURL=index.js.map
 
@@ -7329,101 +7262,6 @@
       /***/
     },
 
-    /***/ 7185: /***/ function(
-      __unused_webpack_module,
-      exports,
-      __webpack_require__
-    ) {
-      "use strict";
-
-      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;
-      }
-      function _arrayWithoutHoles(arr) {
-        if (Array.isArray(arr)) return _arrayLikeToArray(arr);
-      }
-      function _iterableToArray(iter) {
-        if (
-          (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null) ||
-          iter["@@iterator"] != null
-        )
-          return Array.from(iter);
-      }
-      function _nonIterableSpread() {
-        throw new TypeError(
-          "Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."
-        );
-      }
-      function _toConsumableArray(arr) {
-        return (
-          _arrayWithoutHoles(arr) ||
-          _iterableToArray(arr) ||
-          _unsupportedIterableToArray(arr) ||
-          _nonIterableSpread()
-        );
-      }
-      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(n);
-        if (
-          n === "Arguments" ||
-          /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)
-        )
-          return _arrayLikeToArray(o, minLen);
-      }
-      Object.defineProperty(exports, "__esModule", {
-        value: true
-      });
-      exports.getRoutingItems = getRoutingItems;
-      var _getMiddlewareRegex = __webpack_require__(3072);
-      var _routeMatcher = __webpack_require__(3156);
-      var _routeRegex = __webpack_require__(4903);
-      var _sortedRoutes = __webpack_require__(566);
-      var MIDDLEWARE_SUFFIX = "/_middleware";
-      function getRoutingItems(pages, middleware) {
-        // append the suffix so that `getSortedRoutes()` can handle middleware properly
-        var middlewarePages = middleware.map(function(m) {
-          return "".concat(m.page).concat(MIDDLEWARE_SUFFIX);
-        });
-        var middlewareMap = new Map(
-          middleware.map(function(m) {
-            return [m.page, m];
-          })
-        );
-        var sortedRoutes = (0, _sortedRoutes).getSortedRoutes(
-          _toConsumableArray(pages).concat(_toConsumableArray(middlewarePages))
-        );
-        return sortedRoutes.map(function(page) {
-          if (page.endsWith(MIDDLEWARE_SUFFIX)) {
-            var p = page.slice(0, -MIDDLEWARE_SUFFIX.length) || "/";
-            var ssr = middlewareMap.get(p).ssr;
-            return {
-              match: (0, _routeMatcher).getRouteMatcher(
-                (0, _getMiddlewareRegex).getMiddlewareRegex(p, !ssr)
-              ),
-              page: p,
-              ssr: ssr,
-              isMiddleware: true
-            };
-          } else {
-            return {
-              match: (0, _routeMatcher).getRouteMatcher(
-                (0, _routeRegex).getRouteRegex(page)
-              ),
-              page: page
-            };
-          }
-        });
-      } //# sourceMappingURL=routing-items.js.map
-
-      /***/
-    },
-
     /***/ 566: /***/ function(__unused_webpack_module, exports) {
       "use strict";
 
@@ -7498,7 +7336,6 @@
           this.slugName = null;
           this.restSlugName = null;
           this.optionalRestSlugName = null;
-          this.isMiddleware = false;
         }
         _createClass(UrlNode, [
           {
@@ -7533,9 +7370,6 @@
               if (this.optionalRestSlugName !== null) {
                 childrenPaths.splice(childrenPaths.indexOf("[[...]]"), 1);
               }
-              if (this.isMiddleware) {
-                childrenPaths.splice(childrenPaths.indexOf("_middleware"), 1);
-              }
               var routes = childrenPaths
                 .map(function(c) {
                   return _this.children
@@ -7572,21 +7406,10 @@
                 }
                 routes.unshift(r);
               }
-              if (this.isMiddleware) {
+              if (this.restSlugName !== null) {
                 var _routes1;
-                (_routes1 = routes).unshift.apply(
+                (_routes1 = routes).push.apply(
                   _routes1,
-                  _toConsumableArray(
-                    this.children
-                      .get("_middleware")
-                      ._smoosh("".concat(prefix, "_middleware/"))
-                  )
-                );
-              }
-              if (this.restSlugName !== null) {
-                var _routes2;
-                (_routes2 = routes).push.apply(
-                  _routes2,
                   _toConsumableArray(
                     this.children
                       .get("[...]")
@@ -7599,9 +7422,9 @@
                 );
               }
               if (this.optionalRestSlugName !== null) {
-                var _routes3;
-                (_routes3 = routes).push.apply(
-                  _routes3,
+                var _routes2;
+                (_routes2 = routes).push.apply(
+                  _routes2,
                   _toConsumableArray(
                     this.children
                       .get("[[...]]")
@@ -7742,11 +7565,6 @@
                   // nextSegment is overwritten to [] so that it can later be sorted specifically
                   nextSegment = "[]";
                 }
-              } else if (
-                nextSegment === "_middleware" &&
-                urlPaths.length === 1
-              ) {
-                this.isMiddleware = true;
               }
               // If this UrlNode doesn't have the nextSegment yet we create a new child UrlNode
               if (!this.children.has(nextSegment)) {

Diff for index.html

@@ -19,7 +19,7 @@
       defer=""
     ></script>
     <script
-      src="/_next/static/chunks/main-444bd3ddf1f35edc.js"
+      src="/_next/static/chunks/main-68df418029b9a7b3.js"
       defer=""
     ></script>
     <script

Diff for link.html

@@ -19,7 +19,7 @@
       defer=""
     ></script>
     <script
-      src="/_next/static/chunks/main-444bd3ddf1f35edc.js"
+      src="/_next/static/chunks/main-68df418029b9a7b3.js"
       defer=""
     ></script>
     <script
@@ -27,7 +27,7 @@
       defer=""
     ></script>
     <script
-      src="/_next/static/chunks/pages/link-a96e4060bca1ccfe.js"
+      src="/_next/static/chunks/pages/link-a72b8ab130103a8f.js"
       defer=""
     ></script>
     <script src="/_next/static/BUILD_ID/_buildManifest.js" defer=""></script>

Diff for withRouter.html

@@ -19,7 +19,7 @@
       defer=""
     ></script>
     <script
-      src="/_next/static/chunks/main-444bd3ddf1f35edc.js"
+      src="/_next/static/chunks/main-68df418029b9a7b3.js"
       defer=""
     ></script>
     <script

Default Build with SWC (Increase detected ⚠️)

General Overall increase ⚠️

	vercel/next.js canary v12.1.4	vercel/next.js refs/heads/canary	Change
buildDuration	14.8s	14.7s	-128ms
buildDurationCached	7.4s	7.4s	⚠️ +67ms
nodeModulesSize	86.6 MB	86.7 MB	⚠️ +51.7 kB

Page Load Tests Overall increase ✓

	vercel/next.js canary v12.1.4	vercel/next.js refs/heads/canary	Change
/ failed reqs	0	0	✓
/ total time (seconds)	4.111	4.075	-0.04
/ avg req/sec	608.16	613.45	+5.29
/error-in-render failed reqs	0	0	✓
/error-in-render total time (seconds)	2.094	1.984	-0.11
/error-in-render avg req/sec	1193.82	1260.11	+66.29

Client Bundles (main, webpack) Overall decrease ✓

	vercel/next.js canary v12.1.4	vercel/next.js refs/heads/canary	Change
925.HASH.js gzip	178 B	178 B	✓
framework-HASH.js gzip	42.3 kB	42.3 kB	✓
main-HASH.js gzip	28.8 kB	28.3 kB	-486 B
webpack-HASH.js gzip	1.45 kB	1.45 kB	✓
Overall change	72.8 kB	72.3 kB	-486 B

Legacy Client Bundles (polyfills)

	vercel/next.js canary v12.1.4	vercel/next.js refs/heads/canary	Change
polyfills-HASH.js gzip	31 kB	31 kB	✓
Overall change	31 kB	31 kB	✓

Client Pages Overall increase ⚠️

	vercel/next.js canary v12.1.4	vercel/next.js refs/heads/canary	Change
_app-HASH.js gzip	1.35 kB	1.35 kB	✓
_error-HASH.js gzip	179 B	179 B	✓
amp-HASH.js gzip	313 B	313 B	✓
css-HASH.js gzip	325 B	325 B	✓
dynamic-HASH.js gzip	3.03 kB	3.03 kB	✓
head-HASH.js gzip	351 B	351 B	✓
hooks-HASH.js gzip	921 B	921 B	✓
image-HASH.js gzip	5.59 kB	5.74 kB	⚠️ +149 B
index-HASH.js gzip	261 B	261 B	✓
link-HASH.js gzip	2.33 kB	2.38 kB	⚠️ +53 B
routerDirect..HASH.js gzip	322 B	322 B	✓
script-HASH.js gzip	388 B	388 B	✓
withRouter-HASH.js gzip	317 B	317 B	✓
85e02e95b279..7e3.css gzip	107 B	107 B	✓
Overall change	15.8 kB	16 kB	⚠️ +202 B

Client Build Manifests

	vercel/next.js canary v12.1.4	vercel/next.js refs/heads/canary	Change
_buildManifest.js gzip	459 B	459 B	✓
Overall change	459 B	459 B	✓

Rendered Page Sizes Overall decrease ✓

	vercel/next.js canary v12.1.4	vercel/next.js refs/heads/canary	Change
index.html gzip	532 B	532 B	✓
link.html gzip	546 B	544 B	-2 B
withRouter.html gzip	527 B	526 B	-1 B
Overall change	1.6 kB	1.6 kB	-3 B

Diffs

Diff for _buildManifest.js

@@ -12,8 +12,8 @@ self.__BUILD_MANIFEST = {
   ],
   "/head": ["static\u002Fchunks\u002Fpages\u002Fhead-96a5d6ed07cf5a83.js"],
   "/hooks": ["static\u002Fchunks\u002Fpages\u002Fhooks-9dfe734f583d4926.js"],
-  "/image": ["static\u002Fchunks\u002Fpages\u002Fimage-fceff8aa5864bcb2.js"],
-  "/link": ["static\u002Fchunks\u002Fpages\u002Flink-a96e4060bca1ccfe.js"],
+  "/image": ["static\u002Fchunks\u002Fpages\u002Fimage-0e5a6c840e535a1d.js"],
+  "/link": ["static\u002Fchunks\u002Fpages\u002Flink-a72b8ab130103a8f.js"],
   "/routerDirect": [
     "static\u002Fchunks\u002Fpages\u002FrouterDirect-cb15c8ac2322bf32.js"
   ],

Diff for image-HASH.js

@@ -154,8 +154,7 @@
           objectFit = _param.objectFit,
           objectPosition = _param.objectPosition,
           onLoadingComplete = _param.onLoadingComplete,
-          _loader = _param.loader,
-          loader = _loader === void 0 ? defaultImageLoader : _loader,
+          onError = _param.onError,
           _placeholder = _param.placeholder,
           placeholder = _placeholder === void 0 ? "empty" : _placeholder,
           blurDataURL = _param.blurDataURL,
@@ -175,7 +174,7 @@
             "objectFit",
             "objectPosition",
             "onLoadingComplete",
-            "loader",
+            "onError",
             "placeholder",
             "blurDataURL"
           ]);
@@ -206,8 +205,26 @@
         if ("layout" in rest) {
           // Override default layout if the user specified one:
           if (rest.layout) layout = rest.layout;
-          // Remove property so it's not spread into image:
-          delete rest["layout"];
+          // Remove property so it's not spread on <img>:
+          delete rest.layout;
+        }
+        var loader = defaultImageLoader;
+        if ("loader" in rest) {
+          if (rest.loader) {
+            var customImageLoader = rest.loader;
+            var _tmp;
+            (_tmp = function(obj) {
+              var _ = obj.config,
+                opts = _objectWithoutProperties(obj, ["config"]);
+              // The config object is internal only so we must
+              // not pass it to the user-defined loader()
+              return customImageLoader(opts);
+            }),
+              (loader = _tmp),
+              _tmp;
+          }
+          // Remove property so it's not spread on <img>
+          delete rest.loader;
         }
         var staticSrc = "";
         if (isStaticImport(src)) {
@@ -247,16 +264,20 @@
         if (true && loadedImageURLs.has(src)) {
           isLazy = false;
         }
+        var ref2 = _slicedToArray((0, _react).useState(false), 2),
+          blurComplete = ref2[0],
+          setBlurComplete = ref2[1];
         var ref1 = _slicedToArray(
             (0, _useIntersection).useIntersection({
               rootRef: lazyRoot,
               rootMargin: lazyBoundary,
               disabled: !isLazy
             }),
-            2
+            3
           ),
           setIntersection = ref1[0],
-          isIntersected = ref1[1];
+          isIntersected = ref1[1],
+          resetIntersected = ref1[2];
         var isVisible = !isLazy || isIntersected;
         var wrapperStyle = {
           boxSizing: "border-box",
@@ -318,7 +339,7 @@
             : layoutStyle
         );
         var blurStyle =
-          placeholder === "blur"
+          placeholder === "blur" && !blurComplete
             ? {
                 filter: "blur(20px)",
                 backgroundSize: objectFit || "cover",
@@ -404,7 +425,7 @@
           _obj);
         var useLayoutEffect = false ? 0 : _react.default.useLayoutEffect;
         var onLoadingCompleteRef = (0, _react).useRef(onLoadingComplete);
-        var imgRef = (0, _react).useRef(null);
+        var previousImageSrc = (0, _react).useRef(src);
         (0, _react).useEffect(
           function() {
             onLoadingCompleteRef.current = onLoadingComplete;
@@ -413,21 +434,12 @@
         );
         useLayoutEffect(
           function() {
-            setIntersection(imgRef.current);
-          },
-          [setIntersection]
-        );
-        (0, _react).useEffect(
-          function() {
-            handleLoading(
-              imgRef,
-              srcString,
-              layout,
-              placeholder,
-              onLoadingCompleteRef
-            );
+            if (previousImageSrc.current !== src) {
+              resetIntersected();
+              previousImageSrc.current = src;
+            }
           },
-          [srcString, layout, placeholder, isVisible]
+          [resetIntersected, src]
         );
         var imgElementArgs = _objectSpread(
           {
@@ -440,13 +452,16 @@
             className: className,
             imgStyle: imgStyle,
             blurStyle: blurStyle,
-            imgRef: imgRef,
             loading: loading,
             config: config,
             unoptimized: unoptimized,
             placeholder: placeholder,
             loader: loader,
-            srcString: srcString
+            srcString: srcString,
+            onLoadingCompleteRef: onLoadingCompleteRef,
+            setBlurComplete: setBlurComplete,
+            setIntersection: setIntersection,
+            isVisible: isVisible
           },
           rest
         );
@@ -752,9 +767,9 @@
             sizes: undefined
           };
         }
-        var ref2 = getWidths(config, width, layout, sizes),
-          widths = ref2.widths,
-          kind = ref2.kind;
+        var ref3 = getWidths(config, width, layout, sizes),
+          widths = ref3.widths,
+          kind = ref3.kind;
         var last = widths.length - 1;
         return {
           sizes: !sizes && kind === "w" ? "100vw" : sizes,
@@ -816,56 +831,53 @@
       // See https://stackoverflow.com/q/39777833/266535 for why we use this ref
       // handler instead of the img's onLoad attribute.
       function handleLoading(
-        imgRef,
+        img,
         src,
         layout,
         placeholder,
-        onLoadingCompleteRef
+        onLoadingCompleteRef,
+        setBlurComplete
       ) {
-        var handleLoad = function() {
-          var img = imgRef.current;
-          if (!img) {
+        if (
+          !img ||
+          img.src === emptyDataURL ||
+          img["data-loaded-src"] === src
+        ) {
+          return;
+        }
+        img["data-loaded-src"] = src;
+        var p = "decode" in img ? img.decode() : Promise.resolve();
+        p.catch(function() {}).then(function() {
+          if (!img.parentNode) {
+            // Exit early in case of race condition:
+            // - onload() is called
+            // - decode() is called but incomplete
+            // - unmount is called
+            // - decode() completes
             return;
           }
-          if (img.src !== emptyDataURL) {
-            var p = "decode" in img ? img.decode() : Promise.resolve();
-            p.catch(function() {}).then(function() {
-              if (!imgRef.current) {
-                return;
-              }
-              loadedImageURLs.add(src);
-              if (placeholder === "blur") {
-                img.style.filter = "";
-                img.style.backgroundSize = "";
-                img.style.backgroundImage = "";
-                img.style.backgroundPosition = "";
-              }
-              if (onLoadingCompleteRef.current) {
-                var naturalWidth = img.naturalWidth,
-                  naturalHeight = img.naturalHeight;
-                // Pass back read-only primitive values but not the
-                // underlying DOM element because it could be misused.
-                onLoadingCompleteRef.current({
-                  naturalWidth: naturalWidth,
-                  naturalHeight: naturalHeight
-                });
-              }
-              if (false) {
-                var parent, ref3;
-              }
+          loadedImageURLs.add(src);
+          if (placeholder === "blur") {
+            setBlurComplete(true);
+          }
+          if (
+            onLoadingCompleteRef === null || onLoadingCompleteRef === void 0
+              ? void 0
+              : onLoadingCompleteRef.current
+          ) {
+            var naturalWidth = img.naturalWidth,
+              naturalHeight = img.naturalHeight;
+            // Pass back read-only primitive values but not the
+            // underlying DOM element because it could be misused.
+            onLoadingCompleteRef.current({
+              naturalWidth: naturalWidth,
+              naturalHeight: naturalHeight
             });
           }
-        };
-        if (imgRef.current) {
-          if (imgRef.current.complete) {
-            // If the real image fails to load, this will still remove the placeholder.
-            // This is the desired behavior for now, and will be revisited when error
-            // handling is worked on for the image component itself.
-            handleLoad();
-          } else {
-            imgRef.current.onload = handleLoad;
+          if (false) {
+            var parent, ref3;
           }
-        }
+        });
       }
       var ImageElement = function(_param) {
         var imgAttributes = _param.imgAttributes,
@@ -877,14 +889,17 @@
           imgStyle = _param.imgStyle,
           blurStyle = _param.blurStyle,
           isLazy = _param.isLazy,
-          imgRef = _param.imgRef,
           placeholder = _param.placeholder,
           loading = _param.loading,
-          sizes = _param.sizes,
           srcString = _param.srcString,
           config = _param.config,
           unoptimized = _param.unoptimized,
           loader = _param.loader,
+          onLoadingCompleteRef = _param.onLoadingCompleteRef,
+          setBlurComplete = _param.setBlurComplete,
+          setIntersection = _param.setIntersection,
+          onError = _param.onError,
+          isVisible = _param.isVisible,
           rest = _objectWithoutProperties(_param, [
             "imgAttributes",
             "heightInt",
@@ -895,14 +910,17 @@
             "imgStyle",
             "blurStyle",
             "isLazy",
-            "imgRef",
             "placeholder",
             "loading",
-            "sizes",
             "srcString",
             "config",
             "unoptimized",
-            "loader"
+            "loader",
+            "onLoadingCompleteRef",
+            "setBlurComplete",
+            "setIntersection",
+            "onError",
+            "isVisible"
           ]);
         return /*#__PURE__*/ _react.default.createElement(
           _react.default.Fragment,
@@ -913,7 +931,7 @@
               {},
               rest,
               imgAttributes,
-              layout === "raw" && !sizes
+              layout === "raw" && !imgAttributes.sizes
                 ? {
                     height: heightInt,
                     width: widthInt
@@ -923,8 +941,52 @@
                 decoding: "async",
                 "data-nimg": layout,
                 className: className,
-                ref: imgRef,
-                style: _objectSpread({}, imgStyle, blurStyle)
+                style: _objectSpread({}, imgStyle, blurStyle),
+                ref: (0, _react).useCallback(
+                  function(img) {
+                    setIntersection(img);
+                    if (
+                      img === null || img === void 0 ? void 0 : img.complete
+                    ) {
+                      handleLoading(
+                        img,
+                        srcString,
+                        layout,
+                        placeholder,
+                        onLoadingCompleteRef,
+                        setBlurComplete
+                      );
+                    }
+                  },
+                  [
+                    setIntersection,
+                    srcString,
+                    layout,
+                    placeholder,
+                    onLoadingCompleteRef,
+                    setBlurComplete
+                  ]
+                ),
+                onLoad: function(event) {
+                  var img = event.currentTarget;
+                  handleLoading(
+                    img,
+                    srcString,
+                    layout,
+                    placeholder,
+                    onLoadingCompleteRef,
+                    setBlurComplete
+                  );
+                },
+                onError: function(event) {
+                  if (placeholder === "blur") {
+                    // If the real image fails to load, this will still remove the placeholder.
+                    setBlurComplete(true);
+                  }
+                  if (onError) {
+                    onError(event);
+                  }
+                }
               }
             )
           ),
@@ -944,10 +1006,10 @@
                     layout: layout,
                     width: widthInt,
                     quality: qualityInt,
-                    sizes: sizes,
+                    sizes: imgAttributes.sizes,
                     loader: loader
                   }),
-                  layout === "raw" && !sizes
+                  layout === "raw" && !imgAttributes.sizes
                     ? {
                         height: heightInt,
                         width: widthInt
@@ -1159,6 +1221,9 @@
           },
           [isDisabled, root, rootMargin, visible]
         );
+        var resetVisible = (0, _react).useCallback(function() {
+          setVisible(false);
+        }, []);
         (0, _react).useEffect(
           function() {
             if (!hasIntersectionObserver) {
@@ -1183,7 +1248,7 @@
           },
           [rootRef]
         );
-        return [setRef, visible];
+        return [setRef, visible, resetVisible];
       }
       function observe(element, callback, options) {
         var ref = createObserver(options),

Diff for link-HASH.js

@@ -198,6 +198,8 @@
           ),
           href = ref2.href,
           as = ref2.as;
+        var previousHref = _react.default.useRef(href);
+        var previousAs = _react.default.useRef(as);
         var children = props.children,
           replace = props.replace,
           shallow = props.shallow,
@@ -221,12 +223,19 @@
             (0, _useIntersection).useIntersection({
               rootMargin: "200px"
             }),
-            2
+            3
           ),
           setIntersectionRef = ref1[0],
-          isVisible = ref1[1];
+          isVisible = ref1[1],
+          resetVisible = ref1[2];
         var setRef = _react.default.useCallback(
           function(el) {
+            // Before the link getting observed, check if visible state need to be reset
+            if (previousAs.current !== as || previousHref.current !== href) {
+              resetVisible();
+              previousAs.current = as;
+              previousHref.current = href;
+            }
             setIntersectionRef(el);
             if (childRef) {
               if (typeof childRef === "function") childRef(el);
@@ -235,7 +244,7 @@
               }
             }
           },
-          [childRef, setIntersectionRef]
+          [as, childRef, href, resetVisible, setIntersectionRef]
         );
         _react.default.useEffect(
           function() {
@@ -434,6 +443,9 @@
           },
           [isDisabled, root, rootMargin, visible]
         );
+        var resetVisible = (0, _react).useCallback(function() {
+          setVisible(false);
+        }, []);
         (0, _react).useEffect(
           function() {
             if (!hasIntersectionObserver) {
@@ -458,7 +470,7 @@
           },
           [rootRef]
         );
-        return [setRef, visible];
+        return [setRef, visible, resetVisible];
       }
       function observe(element, callback, options) {
         var ref = createObserver(options),

Diff for main-HASH.js

@@ -473,7 +473,7 @@
       var _routeAnnouncer = __webpack_require__(8483);
       var _router1 = __webpack_require__(880);
       var _isError = __webpack_require__(676);
-      var _vitals = __webpack_require__(4564);
+      var _vitals = __webpack_require__(7185);
       var _refresh = __webpack_require__(2129);
       var _imageConfigContext = __webpack_require__(8730);
       function asyncGeneratorStep(
@@ -624,7 +624,7 @@
         }
         return target;
       }
-      var version = "12.1.4";
+      var version = "12.1.5-canary.6";
       exports.version = version;
       var router;
       exports.router = router;
@@ -643,7 +643,7 @@
       var webpackHMR;
       var CachedApp, onPerfEntry;
       var CachedComponent;
-      var isAppRSC;
+      var isRSCPage;
       var Container = /*#__PURE__*/ (function(_Component) {
         _inherits(Container, _Component);
         var _super = _createSuper(Container);
@@ -868,7 +868,6 @@
                       (app = appEntrypoint.component),
                         (mod = appEntrypoint.exports);
                       CachedApp = app;
-                      isAppRSC = !!mod.__next_rsc__;
                       exportedReportWebVitals = mod && mod.reportWebVitals;
                       onPerfEntry = function(param) {
                         var id = param.id,
@@ -909,30 +908,31 @@
                         // error, so we need to skip waiting for the entrypoint.
                         true
                       ) {
-                        _ctx.next = 16;
+                        _ctx.next = 15;
                         break;
                       }
                       _ctx.t0 = {
                         error: initialData.err
                       };
-                      _ctx.next = 19;
-                      break;
-                    case 16:
                       _ctx.next = 18;
+                      break;
+                    case 15:
+                      _ctx.next = 17;
                       return pageLoader.routeLoader.whenEntrypoint(
                         initialData.page
                       );
-                    case 18:
+                    case 17:
                       _ctx.t0 = _ctx.sent;
-                    case 19:
+                    case 18:
                       pageEntrypoint = _ctx.t0;
                       if (!("error" in pageEntrypoint)) {
-                        _ctx.next = 22;
+                        _ctx.next = 21;
                         break;
                       }
                       throw pageEntrypoint.error;
-                    case 22:
+                    case 21:
                       CachedComponent = pageEntrypoint.component;
+                      isRSCPage = !!pageEntrypoint.exports.__next_rsc__;
                       if (true) {
                         _ctx.next = 27;
                         break;
@@ -1177,7 +1177,7 @@
           shouldHydrate ? markHydrateComplete : markRenderComplete
         );
         if (false) {
-          var ReactDOMClient;
+          var startTransition, ReactDOMClient;
         } else {
           // The check for `.hydrate` is there to support React alternatives like preact
           if (shouldHydrate) {
@@ -1318,7 +1318,9 @@
           initialServerDataWriter,
           initialServerDataBuffer,
           encoder,
+          ref1,
           createFromFetch,
+          createFromReadableStream,
           getCacheKey,
           useServerResponse,
           fetchFlight,
@@ -1505,14 +1507,14 @@
           },
           [callbacks]
         );
-        if (false) {
-        }
         // 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);
           (0, _vitals).flushBufferedVitalsMetrics();
         }, []);
+        if (false) {
+        }
         return children;
       }
       // Dummy component that we render as a child of Root so that we can
@@ -1679,7 +1681,7 @@
               var href = param.href,
                 asPath = param.asPath,
                 ssg = param.ssg,
-                rsc = param.rsc,
+                flight = param.flight,
                 locale = param.locale;
               var _this = this;
               var ref = (0, _parseRelativeUrl).parseRelativeUrl(href),
@@ -1690,7 +1692,7 @@
                 asPathname = ref1.pathname;
               var route = normalizeRoute(hrefPathname);
               var getHrefForSlug = function(path) {
-                if (rsc) {
+                if (flight) {
                   return path + search + (search ? "&" : "?") + "__flight__=1";
                 }
                 var dataRoute = (0, _getAssetPathFromRoute).default(
@@ -3197,7 +3199,7 @@
       /***/
     },
 
-    /***/ 4564: /***/ function(
+    /***/ 7185: /***/ function(
       __unused_webpack_module,
       exports,
       __webpack_require__
@@ -4351,8 +4353,8 @@
       var _resolveRewrites = _interopRequireDefault1(__webpack_require__(2431));
       var _routeMatcher = __webpack_require__(3156);
       var _routeRegex = __webpack_require__(4903);
+      var _getMiddlewareRegex = __webpack_require__(3072);
       var _formatUrl = __webpack_require__(7795);
-      var _routingItems = __webpack_require__(7185);
       function _interopRequireDefault1(obj) {
         return obj && obj.__esModule
           ? obj
@@ -4404,6 +4406,10 @@
           ) + path.slice(pathname.length)
         );
       }
+      function hasPathPrefix(path, prefix) {
+        path = pathNoQueryHash(path);
+        return path === prefix || path.startsWith(prefix + "/");
+      }
       function getDomainLocale(path, locale, locales, domainLocales) {
         if (false) {
           var detectedDomain;
@@ -4432,8 +4438,7 @@
         return path;
       }
       function hasBasePath(path) {
-        path = pathNoQueryHash(path);
-        return path === basePath || path.startsWith(basePath + "/");
+        return hasPathPrefix(path, basePath);
       }
       function addBasePath(path) {
         // we only add the basepath on relative urls
@@ -5869,10 +5874,10 @@
                     __N_RSC,
                     isValidElementType,
                     dataHref,
+                    useStreamedFlightData,
                     props,
-                    ref,
-                    fresh,
-                    data;
+                    data,
+                    __flight__;
                   return _runtimeJs.default.wrap(
                     function _callee$(_ctx) {
                       while (1)
@@ -5951,6 +5956,8 @@
                               )
                             );
                           case 17:
+                            useStreamedFlightData =
+                              (false || __N_SSP) && __N_RSC;
                             if (__N_SSG || __N_SSP || __N_RSC) {
                               dataHref = _this.pageLoader.getDataHref({
                                 href: (0, _formatUrl).formatWithValidation({
@@ -5959,13 +5966,14 @@
                                 }),
                                 asPath: resolvedAs,
                                 ssg: __N_SSG,
-                                rsc: __N_RSC,
+                                flight: useStreamedFlightData,
                                 locale: locale
                               });
                             }
-                            _ctx.next = 21;
+                            _ctx.next = 22;
                             return _this._getData(function() {
-                              return __N_SSG || __N_SSP
+                              return (__N_SSG || __N_SSP || __N_RSC) &&
+                                !useStreamedFlightData
                                 ? fetchNextData(
                                     dataHref,
                                     _this.isSsr,
@@ -5982,30 +5990,43 @@
                                     defaultLocale: _this.defaultLocale
                                   });
                             });
-                          case 21:
+                          case 22:
                             props = _ctx.sent;
                             if (!__N_RSC) {
-                              _ctx.next = 29;
+                              _ctx.next = 32;
                               break;
                             }
-                            _ctx.next = 25;
+                            if (!useStreamedFlightData) {
+                              _ctx.next = 31;
+                              break;
+                            }
+                            _ctx.next = 27;
                             return _this._getData(function() {
                               return _this._getFlightData(dataHref);
                             });
-                          case 25:
-                            ref = _ctx.sent;
-                            fresh = ref.fresh;
-                            data = ref.data;
+                          case 27:
+                            data = _ctx.sent.data;
                             props.pageProps = Object.assign(props.pageProps, {
-                              __flight_serialized__: data,
-                              __flight_fresh__: fresh
+                              __flight__: data
                             });
-                          case 29:
+                            _ctx.next = 32;
+                            break;
+                          case 31: {
+                            __flight__ = props.__flight__;
+                            props.pageProps = Object.assign(
+                              {},
+                              props.pageProps,
+                              {
+                                __flight__: __flight__
+                              }
+                            );
+                          }
+                          case 32:
                             routeInfo.props = props;
                             _this.components[route] = routeInfo;
                             return _ctx.abrupt("return", routeInfo);
-                          case 34:
-                            _ctx.prev = 34;
+                          case 37:
+                            _ctx.prev = 37;
                             _ctx.t1 = _ctx["catch"](0);
                             return _ctx.abrupt(
                               "return",
@@ -6017,14 +6038,14 @@
                                 routeProps
                               )
                             );
-                          case 37:
+                          case 40:
                           case "end":
                             return _ctx.stop();
                         }
                     },
                     _callee,
                     null,
-                    [[0, 34]]
+                    [[0, 37]]
                   );
                 })
               )();
@@ -6363,7 +6384,6 @@
               return fetchNextData(dataHref, true, true, this.sdc, false).then(
                 function(serialized) {
                   return {
-                    fresh: true,
                     data: serialized
                   };
                 }
@@ -6378,16 +6398,9 @@
                 _runtimeJs.default.mark(function _callee() {
                   var asPathname,
                     cleanedAs,
-                    middlewareList,
-                    middleware,
-                    routingItems,
+                    fns,
                     requiresPreflight,
-                    _iteratorNormalCompletion,
-                    _didIteratorError,
-                    _iteratorError,
-                    _iterator,
-                    _step,
-                    item,
+                    preflightHref,
                     preflight,
                     parsed,
                     fsPathname,
@@ -6412,116 +6425,62 @@
                             _ctx.next = 4;
                             return _this.pageLoader.getMiddlewareList();
                           case 4:
-                            middlewareList = _ctx.sent;
-                            middleware = middlewareList.map(function(param) {
+                            fns = _ctx.sent;
+                            requiresPreflight = fns.some(function(param) {
                               var _param = _slicedToArray(param, 2),
-                                page = _param[0],
-                                ssr = _param[1];
-                              return {
-                                page: page,
-                                ssr: ssr
-                              };
+                                middleware = _param[0],
+                                isSSR = _param[1];
+                              return (0, _routeMatcher).getRouteMatcher(
+                                (0, _getMiddlewareRegex).getMiddlewareRegex(
+                                  middleware,
+                                  !isSSR
+                                )
+                              )(cleanedAs);
                             });
-                            routingItems = (0, _routingItems).getRoutingItems(
-                              options.pages,
-                              middleware
-                            );
-                            requiresPreflight = false;
-                            (_iteratorNormalCompletion = true),
-                              (_didIteratorError = false),
-                              (_iteratorError = undefined);
-                            _ctx.prev = 9;
-                            _iterator = routingItems[Symbol.iterator]();
-                          case 11:
-                            if (
-                              (_iteratorNormalCompletion = (_step = _iterator.next())
-                                .done)
-                            ) {
-                              _ctx.next = 19;
-                              break;
-                            }
-                            item = _step.value;
-                            if (!item.match(cleanedAs)) {
-                              _ctx.next = 16;
-                              break;
-                            }
-                            if (item.isMiddleware) {
-                              requiresPreflight = true;
-                            }
-                            return _ctx.abrupt("break", 19);
-                          case 16:
-                            _iteratorNormalCompletion = true;
-                            _ctx.next = 11;
-                            break;
-                          case 19:
-                            _ctx.next = 25;
-                            break;
-                          case 21:
-                            _ctx.prev = 21;
-                            _ctx.t0 = _ctx["catch"](9);
-                            _didIteratorError = true;
-                            _iteratorError = _ctx.t0;
-                          case 25:
-                            _ctx.prev = 25;
-                            _ctx.prev = 26;
-                            if (
-                              !_iteratorNormalCompletion &&
-                              _iterator.return != null
-                            ) {
-                              _iterator.return();
-                            }
-                          case 28:
-                            _ctx.prev = 28;
-                            if (!_didIteratorError) {
-                              _ctx.next = 31;
-                              break;
-                            }
-                            throw _iteratorError;
-                          case 31:
-                            return _ctx.finish(28);
-                          case 32:
-                            return _ctx.finish(25);
-                          case 33:
                             if (requiresPreflight) {
-                              _ctx.next = 35;
+                              _ctx.next = 8;
                               break;
                             }
                             return _ctx.abrupt("return", {
                               type: "next"
                             });
-                          case 35:
-                            _ctx.prev = 36;
-                            _ctx.next = 39;
+                          case 8:
+                            preflightHref = addLocale(
+                              options.as,
+                              options.locale
+                            );
+                            _ctx.prev = 10;
+                            _ctx.next = 13;
                             return _this._getPreflightData({
-                              preflightHref: options.as,
+                              preflightHref: preflightHref,
                               shouldCache: options.cache,
                               isPreview: options.isPreview
                             });
-                          case 39:
+                          case 13:
                             preflight = _ctx.sent;
-                            _ctx.next = 45;
+                            _ctx.next = 19;
                             break;
-                          case 42:
-                            _ctx.prev = 42;
-                            _ctx.t1 = _ctx["catch"](36);
+                          case 16:
+                            _ctx.prev = 16;
+                            _ctx.t0 = _ctx["catch"](10);
                             return _ctx.abrupt("return", {
                               type: "redirect",
                               destination: options.as
                             });
-                          case 45:
+                          case 19:
                             if (!preflight.rewrite) {
-                              _ctx.next = 54;
+                              _ctx.next = 28;
                               break;
                             }
                             if (preflight.rewrite.startsWith("/")) {
-                              _ctx.next = 48;
+                              _ctx.next = 22;
                               break;
                             }
                             return _ctx.abrupt("return", {
                               type: "redirect",
                               destination: options.as
                             });
-                          case 48:
+                          case 22:
                             parsed = (0, _parseRelativeUrl).parseRelativeUrl(
                               (0, _normalizeLocalePath).normalizeLocalePath(
                                 hasBasePath(preflight.rewrite)
@@ -6556,13 +6515,13 @@
                               matchedPage: matchedPage,
                               resolvedHref: resolvedHref
                             });
-                          case 54:
+                          case 28:
                             if (!preflight.redirect) {
-                              _ctx.next = 60;
+                              _ctx.next = 34;
                               break;
                             }
                             if (!preflight.redirect.startsWith("/")) {
-                              _ctx.next = 59;
+                              _ctx.next = 33;
                               break;
                             }
                             cleanRedirect = (0,
@@ -6586,35 +6545,31 @@
                               newUrl: newUrl,
                               newAs: newAs
                             });
-                          case 59:
+                          case 33:
                             return _ctx.abrupt("return", {
                               type: "redirect",
                               destination: preflight.redirect
                             });
-                          case 60:
+                          case 34:
                             if (!(preflight.refresh && !preflight.ssr)) {
-                              _ctx.next = 62;
+                              _ctx.next = 36;
                               break;
                             }
                             return _ctx.abrupt("return", {
                               type: "refresh"
                             });
-                          case 62:
+                          case 36:
                             return _ctx.abrupt("return", {
                               type: "next"
                             });
-                          case 63:
+                          case 37:
                           case "end":
                             return _ctx.stop();
                         }
                     },
                     _callee,
                     null,
-                    [
-                      [9, 21, 25, 33],
-                      [26, , 28, 32],
-                      [36, 42]
-                    ]
+                    [[10, 16]]
                   );
                 })
               )();
@@ -6886,17 +6841,11 @@
       });
       exports.getMiddlewareRegex = getMiddlewareRegex;
       var _routeRegex = __webpack_require__(4903);
-      // Identify ^/[param]/ in route string
-      var FIRST_SEGMENT_DYNAMIC = /^\/\[[^/]+?\](?=\/|$)/;
-      var NOT_API_ROUTE = "(?!/api(?:/|$))";
       function getMiddlewareRegex(normalizedRoute) {
         var catchAll =
           arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : true;
         var result = (0, _routeRegex).getParametrizedRoute(normalizedRoute);
-        var notApiRegex = FIRST_SEGMENT_DYNAMIC.test(normalizedRoute)
-          ? NOT_API_ROUTE
-          : "";
-        var catchAllRegex = catchAll ? "(?!_next($|/)).*" : "";
+        var catchAllRegex = catchAll ? "(?!_next).*" : "";
         var catchAllGroupedRegex = catchAll ? "(?:(/.*)?)" : "";
         if ("routeKeys" in result) {
           if (result.parameterizedRoute === "/") {
@@ -6910,12 +6859,10 @@
           return {
             groups: result.groups,
             namedRegex: "^"
-              .concat(notApiRegex)
               .concat(result.namedParameterizedRoute)
               .concat(catchAllGroupedRegex, "$"),
             re: new RegExp(
               "^"
-                .concat(notApiRegex)
                 .concat(result.parameterizedRoute)
                 .concat(catchAllGroupedRegex, "$")
             ),
@@ -6932,7 +6879,6 @@
           groups: {},
           re: new RegExp(
             "^"
-              .concat(notApiRegex)
               .concat(result.parameterizedRoute)
               .concat(catchAllGroupedRegex, "$")
           )
@@ -6970,18 +6916,6 @@
           return _routeRegex.getRouteRegex;
         }
       });
-      Object.defineProperty(exports, "getRoutingItems", {
-        enumerable: true,
-        get: function get() {
-          return _routingItems.getRoutingItems;
-        }
-      });
-      Object.defineProperty(exports, "RoutingItem", {
-        enumerable: true,
-        get: function get() {
-          return _routingItems.RoutingItem;
-        }
-      });
       Object.defineProperty(exports, "getSortedRoutes", {
         enumerable: true,
         get: function get() {
@@ -6997,7 +6931,6 @@
       var _getMiddlewareRegex = __webpack_require__(3072);
       var _routeMatcher = __webpack_require__(3156);
       var _routeRegex = __webpack_require__(4903);
-      var _routingItems = __webpack_require__(7185);
       var _sortedRoutes = __webpack_require__(566);
       var _isDynamic = __webpack_require__(6238); //# sourceMappingURL=index.js.map
 
@@ -7329,101 +7262,6 @@
       /***/
     },
 
-    /***/ 7185: /***/ function(
-      __unused_webpack_module,
-      exports,
-      __webpack_require__
-    ) {
-      "use strict";
-
-      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;
-      }
-      function _arrayWithoutHoles(arr) {
-        if (Array.isArray(arr)) return _arrayLikeToArray(arr);
-      }
-      function _iterableToArray(iter) {
-        if (
-          (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null) ||
-          iter["@@iterator"] != null
-        )
-          return Array.from(iter);
-      }
-      function _nonIterableSpread() {
-        throw new TypeError(
-          "Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."
-        );
-      }
-      function _toConsumableArray(arr) {
-        return (
-          _arrayWithoutHoles(arr) ||
-          _iterableToArray(arr) ||
-          _unsupportedIterableToArray(arr) ||
-          _nonIterableSpread()
-        );
-      }
-      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(n);
-        if (
-          n === "Arguments" ||
-          /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)
-        )
-          return _arrayLikeToArray(o, minLen);
-      }
-      Object.defineProperty(exports, "__esModule", {
-        value: true
-      });
-      exports.getRoutingItems = getRoutingItems;
-      var _getMiddlewareRegex = __webpack_require__(3072);
-      var _routeMatcher = __webpack_require__(3156);
-      var _routeRegex = __webpack_require__(4903);
-      var _sortedRoutes = __webpack_require__(566);
-      var MIDDLEWARE_SUFFIX = "/_middleware";
-      function getRoutingItems(pages, middleware) {
-        // append the suffix so that `getSortedRoutes()` can handle middleware properly
-        var middlewarePages = middleware.map(function(m) {
-          return "".concat(m.page).concat(MIDDLEWARE_SUFFIX);
-        });
-        var middlewareMap = new Map(
-          middleware.map(function(m) {
-            return [m.page, m];
-          })
-        );
-        var sortedRoutes = (0, _sortedRoutes).getSortedRoutes(
-          _toConsumableArray(pages).concat(_toConsumableArray(middlewarePages))
-        );
-        return sortedRoutes.map(function(page) {
-          if (page.endsWith(MIDDLEWARE_SUFFIX)) {
-            var p = page.slice(0, -MIDDLEWARE_SUFFIX.length) || "/";
-            var ssr = middlewareMap.get(p).ssr;
-            return {
-              match: (0, _routeMatcher).getRouteMatcher(
-                (0, _getMiddlewareRegex).getMiddlewareRegex(p, !ssr)
-              ),
-              page: p,
-              ssr: ssr,
-              isMiddleware: true
-            };
-          } else {
-            return {
-              match: (0, _routeMatcher).getRouteMatcher(
-                (0, _routeRegex).getRouteRegex(page)
-              ),
-              page: page
-            };
-          }
-        });
-      } //# sourceMappingURL=routing-items.js.map
-
-      /***/
-    },
-
     /***/ 566: /***/ function(__unused_webpack_module, exports) {
       "use strict";
 
@@ -7498,7 +7336,6 @@
           this.slugName = null;
           this.restSlugName = null;
           this.optionalRestSlugName = null;
-          this.isMiddleware = false;
         }
         _createClass(UrlNode, [
           {
@@ -7533,9 +7370,6 @@
               if (this.optionalRestSlugName !== null) {
                 childrenPaths.splice(childrenPaths.indexOf("[[...]]"), 1);
               }
-              if (this.isMiddleware) {
-                childrenPaths.splice(childrenPaths.indexOf("_middleware"), 1);
-              }
               var routes = childrenPaths
                 .map(function(c) {
                   return _this.children
@@ -7572,21 +7406,10 @@
                 }
                 routes.unshift(r);
               }
-              if (this.isMiddleware) {
+              if (this.restSlugName !== null) {
                 var _routes1;
-                (_routes1 = routes).unshift.apply(
+                (_routes1 = routes).push.apply(
                   _routes1,
-                  _toConsumableArray(
-                    this.children
-                      .get("_middleware")
-                      ._smoosh("".concat(prefix, "_middleware/"))
-                  )
-                );
-              }
-              if (this.restSlugName !== null) {
-                var _routes2;
-                (_routes2 = routes).push.apply(
-                  _routes2,
                   _toConsumableArray(
                     this.children
                       .get("[...]")
@@ -7599,9 +7422,9 @@
                 );
               }
               if (this.optionalRestSlugName !== null) {
-                var _routes3;
-                (_routes3 = routes).push.apply(
-                  _routes3,
+                var _routes2;
+                (_routes2 = routes).push.apply(
+                  _routes2,
                   _toConsumableArray(
                     this.children
                       .get("[[...]]")
@@ -7742,11 +7565,6 @@
                   // nextSegment is overwritten to [] so that it can later be sorted specifically
                   nextSegment = "[]";
                 }
-              } else if (
-                nextSegment === "_middleware" &&
-                urlPaths.length === 1
-              ) {
-                this.isMiddleware = true;
               }
               // If this UrlNode doesn't have the nextSegment yet we create a new child UrlNode
               if (!this.children.has(nextSegment)) {

Diff for index.html

@@ -19,7 +19,7 @@
       defer=""
     ></script>
     <script
-      src="/_next/static/chunks/main-444bd3ddf1f35edc.js"
+      src="/_next/static/chunks/main-68df418029b9a7b3.js"
       defer=""
     ></script>
     <script

Diff for link.html

@@ -19,7 +19,7 @@
       defer=""
     ></script>
     <script
-      src="/_next/static/chunks/main-444bd3ddf1f35edc.js"
+      src="/_next/static/chunks/main-68df418029b9a7b3.js"
       defer=""
     ></script>
     <script
@@ -27,7 +27,7 @@
       defer=""
     ></script>
     <script
-      src="/_next/static/chunks/pages/link-a96e4060bca1ccfe.js"
+      src="/_next/static/chunks/pages/link-a72b8ab130103a8f.js"
       defer=""
     ></script>
     <script src="/_next/static/BUILD_ID/_buildManifest.js" defer=""></script>

Diff for withRouter.html

@@ -19,7 +19,7 @@
       defer=""
     ></script>
     <script
-      src="/_next/static/chunks/main-444bd3ddf1f35edc.js"
+      src="/_next/static/chunks/main-68df418029b9a7b3.js"
       defer=""
     ></script>
     <script

-Original file line number
+Diff line change
@@ Expand Up / @@ -16,5 +16,5 @@ @@
           "registry": "https://registry.npmjs.org/"
         }
       },
-      "version": "12.1.5-canary.5"
+      "version": "12.1.5-canary.6"
     }

-Original file line number
+Diff line change
@@ -1,6 +1,6 @@
     {
       "name": "create-next-app",
-      "version": "12.1.5-canary.5",
+      "version": "12.1.5-canary.6",
       "keywords": [
         "react",
         "next",
@@ Expand Down @@

-Original file line number
+Diff line change
@@ -1,6 +1,6 @@
     {
       "name": "eslint-config-next",
-      "version": "12.1.5-canary.5",
+      "version": "12.1.5-canary.6",
       "description": "ESLint configuration used by NextJS.",
       "main": "index.js",
       "license": "MIT",
@@ Expand All / @@ -9,7 +9,7 @@ @@
         "directory": "packages/eslint-config-next"
       },
       "dependencies": {
-        "@next/eslint-plugin-next": "12.1.5-canary.5",
+        "@next/eslint-plugin-next": "12.1.5-canary.6",
         "@rushstack/eslint-patch": "1.0.8",
         "@typescript-eslint/parser": "5.10.1",
         "eslint-import-resolver-node": "0.3.4",
@@ Expand Down @@

-Original file line number
+Diff line change
@@ -1,6 +1,6 @@
     {
       "name": "@next/eslint-plugin-next",
-      "version": "12.1.5-canary.5",
+      "version": "12.1.5-canary.6",
       "description": "ESLint plugin for NextJS.",
       "main": "lib/index.js",
       "license": "MIT",
@@ Expand Down @@

-Original file line number
+Diff line change
@@ -1,6 +1,6 @@
     {
       "name": "@next/bundle-analyzer",
-      "version": "12.1.5-canary.5",
+      "version": "12.1.5-canary.6",
       "main": "index.js",
       "license": "MIT",
       "repository": {
@@ Expand Down @@

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Commit

There are no files selected for viewing

1 comment on commit `a9d6d9f`

ijjk commented on `a9d6d9f` Apr 11, 2022

Commit

There are no files selected for viewing

1 comment on commit a9d6d9f

ijjk commented on a9d6d9f Apr 11, 2022

Choose a reason for hiding this comment

Stats from current release

Diffs

Diffs

1 comment on commit `a9d6d9f`

ijjk commented on `a9d6d9f` Apr 11, 2022