Skip to content
New issue

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

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

Already on GitHub? Sign in to your account

Add new target for middleware #30299

Merged
merged 34 commits into from
Oct 26, 2021
Merged

Add new target for middleware #30299

merged 34 commits into from
Oct 26, 2021

Conversation

shuding
Copy link
Member

@shuding shuding commented Oct 26, 2021

This PR adds a new compilation target for middleware, alongside the new experimental concurrent rendering architecture.

@ijjk

This comment has been minimized.

@ijjk

This comment has been minimized.

@ijjk

This comment has been minimized.

@ijjk

This comment has been minimized.

@ijjk

This comment has been minimized.

@ijjk

This comment has been minimized.

@ijjk

This comment has been minimized.

@ijjk

This comment has been minimized.

@ijjk

This comment has been minimized.

@ijjk

This comment has been minimized.

@ijjk

This comment has been minimized.

packages/next/build/index.ts Outdated Show resolved Hide resolved
packages/next/build/entries.ts Outdated Show resolved Hide resolved
packages/next/build/output/index.ts Show resolved Hide resolved
packages/next/build/output/index.ts Outdated Show resolved Hide resolved
packages/next/build/output/index.ts Show resolved Hide resolved
packages/next/build/webpack-config.ts Show resolved Hide resolved
['next']
{
next: 'next',
...(webServerRuntime ? { etag: '{}', chalk: '{}' } : {}),
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

That's sounds like a hack...

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah… I didn’t want to put conditions inside the rendering logic everywhere…

...(hasServerComponents
? {
// We have to use the names here instead of hashes to ensure the consistency between builds.
moduleIds: 'named',
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

That bloats the bundle and leaks path info. Hashes are also deterministic.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hashes are not deterministic between different compilers I think. The module IDs from client and server-web have to match each other.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Do you want to have module id equality between server and client build?

named ids also doesn't give you that guarantee.

packages/next/build/webpack-config.ts Outdated Show resolved Hide resolved
packages/next/build/webpack-config.ts Outdated Show resolved Hide resolved
@ijjk

This comment has been minimized.

@ijjk

This comment has been minimized.

@ijjk
Copy link
Member

ijjk commented Oct 26, 2021

Stats from current PR

Default Build (Increase detected ⚠️)
General Overall increase ⚠️
vercel/next.js canary shuding/next.js shu/fa2e Change
buildDuration 18.2s 19.3s ⚠️ +1.1s
buildDurationCached 3.7s 3.7s ⚠️ +2ms
nodeModulesSize 198 MB 207 MB ⚠️ +9.19 MB
Page Load Tests Overall increase ✓
vercel/next.js canary shuding/next.js shu/fa2e Change
/ failed reqs 0 0
/ total time (seconds) 3.353 3.388 ⚠️ +0.03
/ avg req/sec 745.5 737.89 ⚠️ -7.61
/error-in-render failed reqs 0 0
/error-in-render total time (seconds) 1.813 1.749 -0.06
/error-in-render avg req/sec 1378.61 1429.67 +51.06
Client Bundles (main, webpack, commons) Overall increase ⚠️
vercel/next.js canary shuding/next.js shu/fa2e Change
450.HASH.js gzip 179 B 179 B
framework-HASH.js gzip 42.2 kB 42.2 kB
main-HASH.js gzip 27.7 kB 29.4 kB ⚠️ +1.72 kB
webpack-HASH.js gzip 1.45 kB 1.45 kB
Overall change 71.5 kB 73.3 kB ⚠️ +1.72 kB
Legacy Client Bundles (polyfills)
vercel/next.js canary shuding/next.js shu/fa2e Change
polyfills-a4..dd70.js gzip 31 kB 31 kB
Overall change 31 kB 31 kB
Client Pages
vercel/next.js canary shuding/next.js shu/fa2e Change
_app-HASH.js gzip 1.23 kB 1.23 kB
_error-HASH.js gzip 194 B 194 B
amp-HASH.js gzip 312 B 312 B
css-HASH.js gzip 327 B 327 B
dynamic-HASH.js gzip 2.38 kB 2.38 kB
head-HASH.js gzip 350 B 350 B
hooks-HASH.js gzip 635 B 635 B
image-HASH.js gzip 4.44 kB 4.44 kB
index-HASH.js gzip 263 B 263 B
link-HASH.js gzip 1.87 kB 1.87 kB
routerDirect..HASH.js gzip 321 B 321 B
script-HASH.js gzip 383 B 383 B
withRouter-HASH.js gzip 318 B 318 B
334f979574ae..6f4.css gzip 106 B 106 B
Overall change 13.1 kB 13.1 kB
Client Build Manifests
vercel/next.js canary shuding/next.js shu/fa2e Change
_buildManifest.js gzip 459 B 459 B
Overall change 459 B 459 B
Rendered Page Sizes Overall increase ⚠️
vercel/next.js canary shuding/next.js shu/fa2e Change
index.html gzip 533 B 534 B ⚠️ +1 B
link.html gzip 546 B 546 B
withRouter.html gzip 527 B 528 B ⚠️ +1 B
Overall change 1.61 kB 1.61 kB ⚠️ +2 B

Diffs

Diff for main-HASH.js
@@ -539,7 +539,8 @@
         locale = data.locale,
         locales = data.locales,
         domainLocales = data.domainLocales,
-        isPreview = data.isPreview;
+        isPreview = data.isPreview,
+        rsc = data.rsc;
       var defaultLocale = data.defaultLocale;
       var prefix = assetPrefix || "";
       // With dynamic assetPrefix it's no longer possible to set assetPrefix at the build time
@@ -1156,6 +1157,63 @@
           );
         };
       };
+      function createResponseCache() {
+        return false
+          ? 0
+          : {
+              get: function() {},
+              set: function() {}
+            };
+      }
+      var rscCache = createResponseCache();
+      var RSCWrapper = function(param) {
+        var cacheKey = param.cacheKey,
+          serialized = param.serialized,
+          _fresh = param._fresh;
+        var createFromFetch = __webpack_require__(904).createFromFetch;
+        var response = rscCache.get(cacheKey);
+        // If there is no cache, or there is serialized data already
+        if (!response) {
+          response = createFromFetch(
+            serialized
+              ? (function() {
+                  var t = new TransformStream();
+                  t.writable
+                    .getWriter()
+                    .write(new TextEncoder().encode(serialized));
+                  return Promise.resolve({
+                    body: t.readable
+                  });
+                })()
+              : (function() {
+                  var search = location.search;
+                  var flightReqUrl =
+                    location.pathname +
+                    search +
+                    (search ? "&__flight__" : "?__flight__");
+                  return fetch(flightReqUrl);
+                })()
+          );
+          rscCache.set(cacheKey, response);
+        }
+        var root = response.readRoot();
+        return root;
+      };
+      var RSCComponent = function(props) {
+        var ref = (0, _router1).useRouter(),
+          cacheKey = ref.asPath;
+        return /*#__PURE__*/ _react.default.createElement(
+          _react.default.Suspense,
+          {
+            fallback: null
+          },
+          /*#__PURE__*/ _react.default.createElement(RSCWrapper, {
+            cacheKey: cacheKey,
+            serialized: props.__flight_serialized__,
+            _fresh: props.__flight_fresh__
+          })
+        );
+      };
       var lastAppProps;
       function doRender(input) {
         var onStart = // This function has a return type to ensure it doesn't start returning a
@@ -1256,12 +1314,14 @@
         var App = input.App,
           Component = input.Component,
           props = input.props,
-          err = input.err;
+          err = input.err,
+          __N_RSC = input.__N_RSC;
         var styleSheets = "initial" in input ? undefined : input.styleSheets;
         Component = Component || lastAppProps.Component;
         props = props || lastAppProps.props;
+        var isRSC = false ? 0 : !!__N_RSC;
         var appProps = _objectSpread({}, props, {
-          Component: Component,
+          Component: isRSC ? RSCComponent : Component,
           err: err,
           router: router
         });
@@ -1511,7 +1571,12 @@
              * @param {string} asPath the URL as shown in browser (virtual path); used for dynamic routes
              * @returns {string}
              */ key: "getDataHref",
-            value: function getDataHref(href, asPath, ssg, locale) {
+            value: function getDataHref(param) {
+              var href = param.href,
+                asPath = param.asPath,
+                ssg = param.ssg,
+                rsc = param.rsc,
+                locale = param.locale;
               var _this = this;
               var ref = (0, _parseRelativeUrl).parseRelativeUrl(href),
                 hrefPathname = ref.pathname,
@@ -1521,6 +1586,7 @@
                 asPathname = ref1.pathname;
               var route = normalizeRoute(hrefPathname);
               var getHrefForSlug = function(path) {
+                if (rsc) return path + "?__flight__";
                 var dataRoute = (0, _getAssetPathFromRoute).default(
                   (0, _normalizeTrailingSlash).removePathTrailingSlash(
                     (0, _router).addLocale(path, locale)
@@ -4170,7 +4236,7 @@
       var manualScrollRestoration =
         /* unused pure expression or super */ null && false && 0;
       var SSG_DATA_NOT_FOUND = Symbol("SSG_DATA_NOT_FOUND");
-      function fetchRetry(url, attempts) {
+      function fetchRetry(url, attempts, opts) {
         return fetch(url, {
           // Cookies are required to be present for Next.js' SSG "Preview Mode".
           // Cookies may also be required for `getServerSideProps`.
@@ -4187,7 +4253,7 @@
         }).then(function(res) {
           if (!res.ok) {
             if (attempts > 1 && res.status >= 500) {
-              return fetchRetry(url, attempts - 1);
+              return fetchRetry(url, attempts - 1, opts);
             }
             if (res.status === 404) {
               return res.json().then(function(data) {
@@ -4201,12 +4267,13 @@
             }
             throw new Error("Failed to load static props");
           }
-          return res.json();
+          return opts.text ? res.text() : res.json();
         });
       }
       function fetchNextData(
         dataHref,
         isServerRender,
+        text,
         inflightCache,
         persistCache
       ) {
@@ -4217,7 +4284,10 @@
         }
         return (inflightCache[cacheKey] = fetchRetry(
           dataHref,
-          isServerRender ? 3 : 1
+          isServerRender ? 3 : 1,
+          {
+            text: text
+          }
         )
           .catch(function(err) {
             // We should only trigger a server-side transition if this was caused
@@ -4342,7 +4412,8 @@
               props: initialProps,
               err: err,
               __N_SSG: initialProps && initialProps.__N_SSG,
-              __N_SSP: initialProps && initialProps.__N_SSP
+              __N_SSP: initialProps && initialProps.__N_SSP,
+              __N_RSC: !!Component.__next_rsc__
             };
           }
           this.components["/_app"] = {
@@ -5280,9 +5351,13 @@
                       Component,
                       __N_SSG,
                       __N_SSP,
+                      __N_RSC,
                       isValidElementType,
                       dataHref,
-                      props;
+                      props,
+                      _this1,
+                      fresh,
+                      data;
                     return _regeneratorRuntime.default.wrap(
                       function _callee$(_ctx) {
                         while (1)
@@ -5326,7 +5401,8 @@
                                   Component: res.page,
                                   styleSheets: res.styleSheets,
                                   __N_SSG: res.mod.__N_SSG,
-                                  __N_SSP: res.mod.__N_SSP
+                                  __N_SSP: res.mod.__N_SSP,
+                                  __N_RSC: !!res.page.__next_rsc__
                                 };
                               });
                             case 11:
@@ -5338,6 +5414,7 @@
                                 (Component = ref.Component),
                                 (__N_SSG = ref.__N_SSG),
                                 (__N_SSP = ref.__N_SSP),
+                                (__N_RSC = ref.__N_RSC),
                                 ref;
                               if (true) {
                                 _ctx.next = 18;
@@ -5363,16 +5440,17 @@
                                 )
                               );
                             case 18:
-                              if (__N_SSG || __N_SSP) {
-                                dataHref = this.pageLoader.getDataHref(
-                                  (0, _utils).formatWithValidation({
+                              if (__N_SSG || __N_SSP || __N_RSC) {
+                                dataHref = this.pageLoader.getDataHref({
+                                  href: (0, _utils).formatWithValidation({
                                     pathname: pathname,
                                     query: query
                                   }),
-                                  resolvedAs,
-                                  __N_SSG,
-                                  this.locale
-                                );
+                                  asPath: resolvedAs,
+                                  ssg: __N_SSG,
+                                  rsc: __N_RSC,
+                                  locale: this.locale
+                                });
                               }
                               _ctx.next = 22;
                               return this._getData(function() {
@@ -5380,6 +5458,7 @@
                                   ? fetchNextData(
                                       dataHref,
                                       _this.isSsr,
+                                      false,
                                       __N_SSG ? _this.sdc : _this.sdr,
                                       !!__N_SSG
                                     )
@@ -5394,11 +5473,31 @@
                               });
                             case 22:
                               props = _ctx.sent;
+                              if (!__N_RSC) {
+                                _ctx.next = 29;
+                                break;
+                              }
+                              _this1 = this;
+                              _ctx.next = 27;
+                              return this._getData(function() {
+                                return _this1._getFlightData(dataHref);
+                              });
+                            case 27:
+                              var ref1;
+                              (ref1 = _ctx.sent),
+                                (fresh = ref1.fresh),
+                                (data = ref1.data),
+                                ref1;
+                              props.pageProps = Object.assign(props.pageProps, {
+                                __flight_serialized__: data,
+                                __flight_fresh__: fresh
+                              });
+                            case 29:
                               routeInfo.props = props;
                               this.components[route] = routeInfo;
                               return _ctx.abrupt("return", routeInfo);
-                            case 28:
-                              _ctx.prev = 28;
+                            case 34:
+                              _ctx.prev = 34;
                               _ctx.t1 = _ctx["catch"](0);
                               return _ctx.abrupt(
                                 "return",
@@ -5412,14 +5511,14 @@
                                   routeProps
                                 )
                               );
-                            case 31:
+                            case 37:
                             case "end":
                               return _ctx.stop();
                           }
                       },
                       _callee,
                       this,
-                      [[0, 28]]
+                      [[0, 34]]
                     );
                   })
                   .bind(this)
@@ -5453,9 +5552,9 @@
               var ref = _slicedToArray(this.asPath.split("#"), 2),
                 oldUrlNoHash = ref[0],
                 oldHash = ref[1];
-              var ref1 = _slicedToArray(as.split("#"), 2),
-                newUrlNoHash = ref1[0],
-                newHash = ref1[1];
+              var ref9 = _slicedToArray(as.split("#"), 2),
+                newUrlNoHash = ref9[0],
+                newHash = ref9[1];
               // Makes sure we scroll to the provided hash if the url/hash are the same
               if (
                 newHash &&
@@ -5559,10 +5658,10 @@
                               _ctx.next = 12;
                               return (0, _routeLoader).getClientBuildManifest();
                             case 12:
-                              var ref9;
-                              (ref9 = _ctx.sent),
-                                (rewrites = ref9.__rewrites),
-                                ref9;
+                              var ref10;
+                              (ref10 = _ctx.sent),
+                                (rewrites = ref10.__rewrites),
+                                ref10;
                               rewritesResult = (0, _resolveRewrites).default(
                                 addBasePath(addLocale(asPath, this.locale)),
                                 pages,
@@ -5639,15 +5738,17 @@
                                   .then(function(isSsg) {
                                     return isSsg
                                       ? fetchNextData(
-                                          _this.pageLoader.getDataHref(
-                                            url,
-                                            resolvedAs,
-                                            true,
-                                            typeof options.locale !==
+                                          _this.pageLoader.getDataHref({
+                                            href: url,
+                                            asPath: resolvedAs,
+                                            ssg: true,
+                                            locale:
+                                              typeof options.locale !==
                                               "undefined"
-                                              ? options.locale
-                                              : _this.locale
-                                          ),
+                                                ? options.locale
+                                                : _this.locale
+                                          }),
+                                          false,
                                           false,
                                           _this.sdc,
                                           true
@@ -5755,6 +5856,29 @@
               });
             }
           },
+          {
+            key: "_getFlightData",
+            value: function _getFlightData(dataHref) {
+              var _this = this;
+              var ref = new URL(dataHref, window.location.href),
+                cacheKey = ref.href;
+              if (!this.isPreview && this.sdc[cacheKey]) {
+                return Promise.resolve({
+                  fresh: false,
+                  data: this.sdc[cacheKey]
+                });
+              }
+              return fetchNextData(dataHref, true, true, this.sdc, false).then(
+                function(serialized) {
+                  _this.sdc[cacheKey] = serialized;
+                  return {
+                    fresh: true,
+                    data: serialized
+                  };
+                }
+              );
+            }
+          },
           {
             key: "_preflightRequest",
             value: function _preflightRequest(options) {
@@ -5788,12 +5912,14 @@
                               return this.pageLoader.getMiddlewareList();
                             case 4:
                               fns = _ctx.sent;
-                              requiresPreflight = fns.some(function(
-                                middleware
-                              ) {
+                              requiresPreflight = fns.some(function(param) {
+                                var _param = _slicedToArray(param, 2),
+                                  middleware = _param[0],
+                                  isSSR = _param[1];
                                 return (0, _routeMatcher).getRouteMatcher(
                                   (0, _getMiddlewareRegex).getMiddlewareRegex(
-                                    middleware
+                                    middleware,
+                                    !isSSR
                                   )
                                 )(cleanedAs);
                               });
@@ -5873,15 +5999,15 @@
                                   this.locales
                                 ).pathname
                               );
-                              var ref10;
-                              (ref10 = prepareUrlAs(
+                              var ref11;
+                              (ref11 = prepareUrlAs(
                                 this,
                                 cleanRedirect,
                                 cleanRedirect
                               )),
-                                (newUrl = ref10.url),
-                                (newAs = ref10.as),
-                                ref10;
+                                (newUrl = ref11.url),
+                                (newAs = ref11.as),
+                                ref11;
                               return _ctx.abrupt("return", {
                                 type: "redirect",
                                 newUrl: newUrl,
@@ -5893,7 +6019,7 @@
                                 destination: preflight.redirect
                               });
                             case 24:
-                              if (!preflight.refresh) {
+                              if (!(preflight.refresh && !preflight.ssr)) {
                                 _ctx.next = 26;
                                 break;
                               }
@@ -5921,7 +6047,7 @@
             key: "_getPreflightData",
             value: function _getPreflightData(params) {
               var _this = this,
-                _this1 = this;
+                _this2 = this;
               var preflightHref = params.preflightHref,
                 _shouldCache = params.shouldCache,
                 shouldCache = _shouldCache === void 0 ? false : _shouldCache;
@@ -5949,7 +6075,8 @@
                   return {
                     redirect: res.headers.get("Location"),
                     refresh: res.headers.has("x-middleware-refresh"),
-                    rewrite: res.headers.get("x-middleware-rewrite")
+                    rewrite: res.headers.get("x-middleware-rewrite"),
+                    ssr: !!res.headers.get("x-middleware-ssr")
                   };
                 })
                 .then(function(data) {
@@ -5959,7 +6086,7 @@
                   return data;
                 })
                 .catch(function(err) {
-                  delete _this1.sde[cacheKey];
+                  delete _this2.sde[cacheKey];
                   throw err;
                 });
             }
@@ -6131,25 +6258,29 @@
       });
       exports.getMiddlewareRegex = getMiddlewareRegex;
       var _routeRegex = __webpack_require__(4095);
-      function getMiddlewareRegex(normalizedRoute) {
+      function getMiddlewareRegex(normalizedRoute, param) {
+        var catchAll = param === void 0 ? true : param;
         var result = (0, _routeRegex).getParametrizedRoute(normalizedRoute);
+        var catchAllRegex = catchAll ? "(?!_next).*" : "";
+        var catchAllGroupedRegex = catchAll ? "(?:(/.*)?)" : "";
         if ("routeKeys" in result) {
           if (result.parameterizedRoute === "/") {
             return {
               groups: {},
-              namedRegex: "^/(?!_next).*$",
-              re: new RegExp("^/(?!_next).*$"),
+              namedRegex: "^/".concat(catchAllRegex, "$"),
+              re: new RegExp("^/".concat(catchAllRegex, "$")),
               routeKeys: {}
             };
           }
           return {
             groups: result.groups,
-            namedRegex: "^".concat(
-              result.namedParameterizedRoute,
-              "(?:(/.*)?)$"
-            ),
+            namedRegex: "^"
+              .concat(result.namedParameterizedRoute)
+              .concat(catchAllGroupedRegex, "$"),
             re: new RegExp(
-              "^".concat(result.parameterizedRoute, "(?:(/.*)?)$")
+              "^"
+                .concat(result.parameterizedRoute)
+                .concat(catchAllGroupedRegex, "$")
             ),
             routeKeys: result.routeKeys
           };
@@ -6157,12 +6288,16 @@
         if (result.parameterizedRoute === "/") {
           return {
             groups: {},
-            re: new RegExp("^/.*$")
+            re: new RegExp("^/".concat(catchAllRegex, "$"))
           };
         }
         return {
           groups: {},
-          re: new RegExp("^".concat(result.parameterizedRoute, "(?:(/.*)?)$"))
+          re: new RegExp(
+            "^"
+              .concat(result.parameterizedRoute)
+              .concat(catchAllGroupedRegex, "$")
+          )
         };
       } //# sourceMappingURL=get-middleware-regex.js.map
 
@@ -7693,6 +7828,301 @@
       /***/
     },
 
+    /***/ 9730: /***/ function(
+      __unused_webpack_module,
+      exports,
+      __webpack_require__
+    ) {
+      "use strict";
+      var __webpack_unused_export__;
+      /** @license React vundefined
+       * react-server-dom-webpack.production.min.js
+       *
+       * Copyright (c) Facebook, Inc. and its affiliates.
+       *
+       * This source code is licensed under the MIT license found in the
+       * LICENSE file in the root directory of this source tree.
+       */
+      function h(a) {
+        for (
+          var b = "https://reactjs.org/docs/error-decoder.html?invariant=" + a,
+            c = 1;
+          c < arguments.length;
+          c++
+        )
+          b += "&args[]=" + encodeURIComponent(arguments[c]);
+        return (
+          "Minified React error #" +
+          a +
+          "; visit " +
+          b +
+          " for the full message or use the non-minified dev environment for full errors and additional helpful warnings."
+        );
+      }
+      var k = { stream: !0 },
+        l = new Map(),
+        n = 60103,
+        q = 60116;
+      if ("function" === typeof Symbol && Symbol.for) {
+        var r = Symbol.for;
+        n = r("react.element");
+        q = r("react.lazy");
+      }
+      function t(a, b, c) {
+        this._status = a;
+        this._value = b;
+        this._response = c;
+      }
+      t.prototype.then = function(a) {
+        0 === this._status
+          ? (null === this._value && (this._value = []), this._value.push(a))
+          : a();
+      };
+      function u(a) {
+        switch (a._status) {
+          case 3:
+            return a._value;
+          case 1:
+            var b = JSON.parse(a._value, a._response._fromJSON);
+            a._status = 3;
+            return (a._value = b);
+          case 2:
+            b = a._value;
+            for (var c = b.chunks, d = 0; d < c.length; d++) {
+              var e = l.get(c[d]);
+              if (null !== e) throw e;
+            }
+            c = __webpack_require__(b.id);
+            b =
+              "*" === b.name
+                ? c
+                : "" === b.name
+                ? c.__esModule
+                  ? c.default
+                  : c
+                : c[b.name];
+            a._status = 3;
+            return (a._value = b);
+          case 0:
+            throw a;
+          default:
+            throw a._value;
+        }
+      }
+      function v() {
+        var a = w(this, 0);
+        return u(a);
+      }
+      function x(a, b) {
+        return new t(3, b, a);
+      }
+      function y(a) {
+        if (null !== a) for (var b = 0; b < a.length; b++) (0, a[b])();
+      }
+      function z(a, b) {
+        if (0 === a._status) {
+          var c = a._value;
+          a._status = 4;
+          a._value = b;
+          y(c);
+        }
+      }
+      function B(a, b) {
+        a._chunks.forEach(function(a) {
+          z(a, b);
+        });
+      }
+      function w(a, b) {
+        var c = a._chunks,
+          d = c.get(b);
+        d || ((d = new t(0, null, a)), c.set(b, d));
+        return d;
+      }
+      function C(a, b, c) {
+        switch (c[0]) {
+          case "$":
+            if ("$" === c) return n;
+            if ("$" === c[1] || "@" === c[1]) return c.substring(1);
+            b = parseInt(c.substring(1), 16);
+            a = w(a, b);
+            return u(a);
+          case "@":
+            return (
+              (b = parseInt(c.substring(1), 16)),
+              (a = w(a, b)),
+              { $$typeof: q, _payload: a, _init: u }
+            );
+        }
+        return c;
+      }
+      function D(a, b) {
+        if ("" !== b) {
+          var c = b[0],
+            d = b.indexOf(":", 1),
+            e = parseInt(b.substring(1, d), 16);
+          d = b.substring(d + 1);
+          switch (c) {
+            case "J":
+              b = a._chunks;
+              (c = b.get(e))
+                ? 0 === c._status &&
+                  ((a = c._value), (c._status = 1), (c._value = d), y(a))
+                : b.set(e, new t(1, d, a));
+              break;
+            case "M":
+              b = a._chunks;
+              c = b.get(e);
+              d = JSON.parse(d, a._fromJSON);
+              for (var p = d.chunks, g = 0; g < p.length; g++) {
+                var f = p[g];
+                if (void 0 === l.get(f)) {
+                  var A = __webpack_require__.e(f),
+                    m = l.set.bind(l, f, null),
+                    G = l.set.bind(l, f);
+                  A.then(m, G);
+                  l.set(f, A);
+                }
+              }
+              c
+                ? 0 === c._status &&
+                  ((a = c._value), (c._status = 2), (c._value = d), y(a))
+                : b.set(e, new t(2, d, a));
+              break;
+            case "S":
+              c = JSON.parse(d);
+              a._chunks.set(e, x(a, Symbol.for(c)));
+              break;
+            case "E":
+              b = JSON.parse(d);
+              c = Error(b.message);
+              c.stack = b.stack;
+              b = a._chunks;
+              (d = b.get(e)) ? z(d, c) : b.set(e, new t(4, c, a));
+              break;
+            default:
+              throw Error(h(415));
+          }
+        }
+      }
+      function E(a) {
+        return function(b, c) {
+          return "string" === typeof c
+            ? C(a, this, c)
+            : "object" === typeof c && null !== c
+            ? ((b =
+                c[0] === n
+                  ? {
+                      $$typeof: n,
+                      type: c[1],
+                      key: c[2],
+                      ref: null,
+                      props: c[3],
+                      _owner: null
+                    }
+                  : c),
+              b)
+            : c;
+        };
+      }
+      function F() {
+        var a = new TextDecoder();
+        a = {
+          _chunks: new Map(),
+          readRoot: v,
+          _partialRow: "",
+          _stringDecoder: a
+        };
+        a._fromJSON = E(a);
+        return a;
+      }
+      function H(a, b) {
+        function c(b) {
+          var g = b.value;
+          if (b.done) B(a, Error(h(412)));
+          else {
+            b = g;
+            g = a._stringDecoder;
+            for (var f = b.indexOf(10); -1 < f; ) {
+              var p = a._partialRow;
+              var m = b.subarray(0, f);
+              m = g.decode(m);
+              D(a, p + m);
+              a._partialRow = "";
+              b = b.subarray(f + 1);
+              f = b.indexOf(10);
+            }
+            a._partialRow += g.decode(b, k);
+            return e.read().then(c, d);
+          }
+        }
+        function d(b) {
+          B(a, b);
+        }
+        var e = b.getReader();
+        e.read().then(c, d);
+      }
+      exports.createFromFetch = function(a) {
+        var b = F();
+        a.then(
+          function(a) {
+            H(b, a.body);
+          },
+          function(a) {
+            B(b, a);
+          }
+        );
+        return b;
+      };
+      __webpack_unused_export__ = function(a) {
+        var b = F();
+        H(b, a);
+        return b;
+      };
+      __webpack_unused_export__ = function(a) {
+        function b() {
+          for (var b = a.responseText, c = e, f = b.indexOf("\n", c); -1 < f; )
+            (c = d._partialRow + b.substring(c, f)),
+              D(d, c),
+              (d._partialRow = ""),
+              (c = f + 1),
+              (f = b.indexOf("\n", c));
+          d._partialRow += b.substring(c);
+          e = b.length;
+        }
+        function c() {
+          B(d, new TypeError("Network error"));
+        }
+        var d = F(),
+          e = 0;
+        a.addEventListener("progress", b);
+        a.addEventListener("load", function() {
+          b();
+          B(d, Error(h(412)));
+        });
+        a.addEventListener("error", c);
+        a.addEventListener("abort", c);
+        a.addEventListener("timeout", c);
+        return d;
+      };
+
+      /***/
+    },
+
+    /***/ 904: /***/ function(
+      module,
+      __unused_webpack_exports,
+      __webpack_require__
+    ) {
+      "use strict";
+
+      if (true) {
+        module.exports = __webpack_require__(9730);
+      } else {
+      }
+
+      /***/
+    },
+
     /***/ 5666: /***/ function(module) {
       /**
        * Copyright (c) 2014-present, Facebook, Inc.
Diff for index.html
@@ -19,7 +19,7 @@
       defer=""
     ></script>
     <script
-      src="/_next/static/chunks/main-65523f6309469c41.js"
+      src="/_next/static/chunks/main-74a8dcbd5a095cdc.js"
       defer=""
     ></script>
     <script
Diff for link.html
@@ -19,7 +19,7 @@
       defer=""
     ></script>
     <script
-      src="/_next/static/chunks/main-65523f6309469c41.js"
+      src="/_next/static/chunks/main-74a8dcbd5a095cdc.js"
       defer=""
     ></script>
     <script
Diff for withRouter.html
@@ -19,7 +19,7 @@
       defer=""
     ></script>
     <script
-      src="/_next/static/chunks/main-65523f6309469c41.js"
+      src="/_next/static/chunks/main-74a8dcbd5a095cdc.js"
       defer=""
     ></script>
     <script

Default Build with SWC (Increase detected ⚠️)
General Overall increase ⚠️
vercel/next.js canary shuding/next.js shu/fa2e Change
buildDuration 15.9s 15.4s -514ms
buildDurationCached 3.7s 3.7s -59ms
nodeModulesSize 198 MB 207 MB ⚠️ +9.19 MB
Page Load Tests Overall decrease ⚠️
vercel/next.js canary shuding/next.js shu/fa2e Change
/ failed reqs 0 0
/ total time (seconds) 3.238 3.324 ⚠️ +0.09
/ avg req/sec 772.03 752.09 ⚠️ -19.94
/error-in-render failed reqs 0 0
/error-in-render total time (seconds) 1.774 1.835 ⚠️ +0.06
/error-in-render avg req/sec 1409.35 1362.64 ⚠️ -46.71
Client Bundles (main, webpack, commons) Overall increase ⚠️
vercel/next.js canary shuding/next.js shu/fa2e Change
450.HASH.js gzip 179 B 179 B
framework-HASH.js gzip 42.2 kB 42.2 kB
main-HASH.js gzip 27.8 kB 29.5 kB ⚠️ +1.73 kB
webpack-HASH.js gzip 1.43 kB 1.43 kB
Overall change 71.6 kB 73.4 kB ⚠️ +1.73 kB
Legacy Client Bundles (polyfills)
vercel/next.js canary shuding/next.js shu/fa2e Change
polyfills-a4..dd70.js gzip 31 kB 31 kB
Overall change 31 kB 31 kB
Client Pages
vercel/next.js canary shuding/next.js shu/fa2e Change
_app-HASH.js gzip 1.22 kB 1.22 kB
_error-HASH.js gzip 180 B 180 B
amp-HASH.js gzip 305 B 305 B
css-HASH.js gzip 321 B 321 B
dynamic-HASH.js gzip 2.38 kB 2.38 kB
head-HASH.js gzip 342 B 342 B
hooks-HASH.js gzip 621 B 621 B
image-HASH.js gzip 4.46 kB 4.46 kB
index-HASH.js gzip 256 B 256 B
link-HASH.js gzip 1.9 kB 1.9 kB
routerDirect..HASH.js gzip 314 B 314 B
script-HASH.js gzip 375 B 375 B
withRouter-HASH.js gzip 309 B 309 B
334f979574ae..6f4.css gzip 106 B 106 B
Overall change 13.1 kB 13.1 kB
Client Build Manifests
vercel/next.js canary shuding/next.js shu/fa2e Change
_buildManifest.js gzip 459 B 459 B
Overall change 459 B 459 B
Rendered Page Sizes
vercel/next.js canary shuding/next.js shu/fa2e Change
index.html gzip 534 B 533 B -1 B
link.html gzip 546 B 547 B ⚠️ +1 B
withRouter.html gzip 528 B 528 B
Overall change 1.61 kB 1.61 kB

Diffs

Diff for main-HASH.js
@@ -539,7 +539,8 @@
         locale = data.locale,
         locales = data.locales,
         domainLocales = data.domainLocales,
-        isPreview = data.isPreview;
+        isPreview = data.isPreview,
+        rsc = data.rsc;
       var defaultLocale = data.defaultLocale;
       var prefix = assetPrefix || "";
       // With dynamic assetPrefix it's no longer possible to set assetPrefix at the build time
@@ -1156,6 +1157,63 @@
           );
         };
       };
+      function createResponseCache() {
+        return false
+          ? 0
+          : {
+              get: function() {},
+              set: function() {}
+            };
+      }
+      var rscCache = createResponseCache();
+      var RSCWrapper = function(param) {
+        var cacheKey = param.cacheKey,
+          serialized = param.serialized,
+          _fresh = param._fresh;
+        var createFromFetch = __webpack_require__(904).createFromFetch;
+        var response = rscCache.get(cacheKey);
+        // If there is no cache, or there is serialized data already
+        if (!response) {
+          response = createFromFetch(
+            serialized
+              ? (function() {
+                  var t = new TransformStream();
+                  t.writable
+                    .getWriter()
+                    .write(new TextEncoder().encode(serialized));
+                  return Promise.resolve({
+                    body: t.readable
+                  });
+                })()
+              : (function() {
+                  var search = location.search;
+                  var flightReqUrl =
+                    location.pathname +
+                    search +
+                    (search ? "&__flight__" : "?__flight__");
+                  return fetch(flightReqUrl);
+                })()
+          );
+          rscCache.set(cacheKey, response);
+        }
+        var root = response.readRoot();
+        return root;
+      };
+      var RSCComponent = function(props) {
+        var ref = (0, _router1).useRouter(),
+          cacheKey = ref.asPath;
+        return /*#__PURE__*/ _react.default.createElement(
+          _react.default.Suspense,
+          {
+            fallback: null
+          },
+          /*#__PURE__*/ _react.default.createElement(RSCWrapper, {
+            cacheKey: cacheKey,
+            serialized: props.__flight_serialized__,
+            _fresh: props.__flight_fresh__
+          })
+        );
+      };
       var lastAppProps;
       function doRender(input) {
         var onStart = // This function has a return type to ensure it doesn't start returning a
@@ -1256,12 +1314,14 @@
         var App = input.App,
           Component = input.Component,
           props = input.props,
-          err = input.err;
+          err = input.err,
+          __N_RSC = input.__N_RSC;
         var styleSheets = "initial" in input ? undefined : input.styleSheets;
         Component = Component || lastAppProps.Component;
         props = props || lastAppProps.props;
+        var isRSC = false ? 0 : !!__N_RSC;
         var appProps = _objectSpread({}, props, {
-          Component: Component,
+          Component: isRSC ? RSCComponent : Component,
           err: err,
           router: router
         });
@@ -1511,7 +1571,12 @@
              * @param {string} asPath the URL as shown in browser (virtual path); used for dynamic routes
              * @returns {string}
              */ key: "getDataHref",
-            value: function getDataHref(href, asPath, ssg, locale) {
+            value: function getDataHref(param) {
+              var href = param.href,
+                asPath = param.asPath,
+                ssg = param.ssg,
+                rsc = param.rsc,
+                locale = param.locale;
               var _this = this;
               var ref = (0, _parseRelativeUrl).parseRelativeUrl(href),
                 hrefPathname = ref.pathname,
@@ -1521,6 +1586,7 @@
                 asPathname = ref1.pathname;
               var route = normalizeRoute(hrefPathname);
               var getHrefForSlug = function(path) {
+                if (rsc) return path + "?__flight__";
                 var dataRoute = (0, _getAssetPathFromRoute).default(
                   (0, _normalizeTrailingSlash).removePathTrailingSlash(
                     (0, _router).addLocale(path, locale)
@@ -4170,7 +4236,7 @@
       var manualScrollRestoration =
         /* unused pure expression or super */ null && false && 0;
       var SSG_DATA_NOT_FOUND = Symbol("SSG_DATA_NOT_FOUND");
-      function fetchRetry(url, attempts) {
+      function fetchRetry(url, attempts, opts) {
         return fetch(url, {
           // Cookies are required to be present for Next.js' SSG "Preview Mode".
           // Cookies may also be required for `getServerSideProps`.
@@ -4187,7 +4253,7 @@
         }).then(function(res) {
           if (!res.ok) {
             if (attempts > 1 && res.status >= 500) {
-              return fetchRetry(url, attempts - 1);
+              return fetchRetry(url, attempts - 1, opts);
             }
             if (res.status === 404) {
               return res.json().then(function(data) {
@@ -4201,12 +4267,13 @@
             }
             throw new Error("Failed to load static props");
           }
-          return res.json();
+          return opts.text ? res.text() : res.json();
         });
       }
       function fetchNextData(
         dataHref,
         isServerRender,
+        text,
         inflightCache,
         persistCache
       ) {
@@ -4217,7 +4284,10 @@
         }
         return (inflightCache[cacheKey] = fetchRetry(
           dataHref,
-          isServerRender ? 3 : 1
+          isServerRender ? 3 : 1,
+          {
+            text: text
+          }
         )
           .catch(function(err) {
             // We should only trigger a server-side transition if this was caused
@@ -4342,7 +4412,8 @@
               props: initialProps,
               err: err,
               __N_SSG: initialProps && initialProps.__N_SSG,
-              __N_SSP: initialProps && initialProps.__N_SSP
+              __N_SSP: initialProps && initialProps.__N_SSP,
+              __N_RSC: !!Component.__next_rsc__
             };
           }
           this.components["/_app"] = {
@@ -5280,9 +5351,13 @@
                       Component,
                       __N_SSG,
                       __N_SSP,
+                      __N_RSC,
                       isValidElementType,
                       dataHref,
-                      props;
+                      props,
+                      _this1,
+                      fresh,
+                      data;
                     return _regeneratorRuntime.default.wrap(
                       function _callee$(_ctx) {
                         while (1)
@@ -5326,7 +5401,8 @@
                                   Component: res.page,
                                   styleSheets: res.styleSheets,
                                   __N_SSG: res.mod.__N_SSG,
-                                  __N_SSP: res.mod.__N_SSP
+                                  __N_SSP: res.mod.__N_SSP,
+                                  __N_RSC: !!res.page.__next_rsc__
                                 };
                               });
                             case 11:
@@ -5338,6 +5414,7 @@
                                 (Component = ref.Component),
                                 (__N_SSG = ref.__N_SSG),
                                 (__N_SSP = ref.__N_SSP),
+                                (__N_RSC = ref.__N_RSC),
                                 ref;
                               if (true) {
                                 _ctx.next = 18;
@@ -5363,16 +5440,17 @@
                                 )
                               );
                             case 18:
-                              if (__N_SSG || __N_SSP) {
-                                dataHref = this.pageLoader.getDataHref(
-                                  (0, _utils).formatWithValidation({
+                              if (__N_SSG || __N_SSP || __N_RSC) {
+                                dataHref = this.pageLoader.getDataHref({
+                                  href: (0, _utils).formatWithValidation({
                                     pathname: pathname,
                                     query: query
                                   }),
-                                  resolvedAs,
-                                  __N_SSG,
-                                  this.locale
-                                );
+                                  asPath: resolvedAs,
+                                  ssg: __N_SSG,
+                                  rsc: __N_RSC,
+                                  locale: this.locale
+                                });
                               }
                               _ctx.next = 22;
                               return this._getData(function() {
@@ -5380,6 +5458,7 @@
                                   ? fetchNextData(
                                       dataHref,
                                       _this.isSsr,
+                                      false,
                                       __N_SSG ? _this.sdc : _this.sdr,
                                       !!__N_SSG
                                     )
@@ -5394,11 +5473,31 @@
                               });
                             case 22:
                               props = _ctx.sent;
+                              if (!__N_RSC) {
+                                _ctx.next = 29;
+                                break;
+                              }
+                              _this1 = this;
+                              _ctx.next = 27;
+                              return this._getData(function() {
+                                return _this1._getFlightData(dataHref);
+                              });
+                            case 27:
+                              var ref1;
+                              (ref1 = _ctx.sent),
+                                (fresh = ref1.fresh),
+                                (data = ref1.data),
+                                ref1;
+                              props.pageProps = Object.assign(props.pageProps, {
+                                __flight_serialized__: data,
+                                __flight_fresh__: fresh
+                              });
+                            case 29:
                               routeInfo.props = props;
                               this.components[route] = routeInfo;
                               return _ctx.abrupt("return", routeInfo);
-                            case 28:
-                              _ctx.prev = 28;
+                            case 34:
+                              _ctx.prev = 34;
                               _ctx.t1 = _ctx["catch"](0);
                               return _ctx.abrupt(
                                 "return",
@@ -5412,14 +5511,14 @@
                                   routeProps
                                 )
                               );
-                            case 31:
+                            case 37:
                             case "end":
                               return _ctx.stop();
                           }
                       },
                       _callee,
                       this,
-                      [[0, 28]]
+                      [[0, 34]]
                     );
                   })
                   .bind(this)
@@ -5453,9 +5552,9 @@
               var ref = _slicedToArray(this.asPath.split("#"), 2),
                 oldUrlNoHash = ref[0],
                 oldHash = ref[1];
-              var ref1 = _slicedToArray(as.split("#"), 2),
-                newUrlNoHash = ref1[0],
-                newHash = ref1[1];
+              var ref9 = _slicedToArray(as.split("#"), 2),
+                newUrlNoHash = ref9[0],
+                newHash = ref9[1];
               // Makes sure we scroll to the provided hash if the url/hash are the same
               if (
                 newHash &&
@@ -5559,10 +5658,10 @@
                               _ctx.next = 12;
                               return (0, _routeLoader).getClientBuildManifest();
                             case 12:
-                              var ref9;
-                              (ref9 = _ctx.sent),
-                                (rewrites = ref9.__rewrites),
-                                ref9;
+                              var ref10;
+                              (ref10 = _ctx.sent),
+                                (rewrites = ref10.__rewrites),
+                                ref10;
                               rewritesResult = (0, _resolveRewrites).default(
                                 addBasePath(addLocale(asPath, this.locale)),
                                 pages,
@@ -5639,15 +5738,17 @@
                                   .then(function(isSsg) {
                                     return isSsg
                                       ? fetchNextData(
-                                          _this.pageLoader.getDataHref(
-                                            url,
-                                            resolvedAs,
-                                            true,
-                                            typeof options.locale !==
+                                          _this.pageLoader.getDataHref({
+                                            href: url,
+                                            asPath: resolvedAs,
+                                            ssg: true,
+                                            locale:
+                                              typeof options.locale !==
                                               "undefined"
-                                              ? options.locale
-                                              : _this.locale
-                                          ),
+                                                ? options.locale
+                                                : _this.locale
+                                          }),
+                                          false,
                                           false,
                                           _this.sdc,
                                           true
@@ -5755,6 +5856,29 @@
               });
             }
           },
+          {
+            key: "_getFlightData",
+            value: function _getFlightData(dataHref) {
+              var _this = this;
+              var ref = new URL(dataHref, window.location.href),
+                cacheKey = ref.href;
+              if (!this.isPreview && this.sdc[cacheKey]) {
+                return Promise.resolve({
+                  fresh: false,
+                  data: this.sdc[cacheKey]
+                });
+              }
+              return fetchNextData(dataHref, true, true, this.sdc, false).then(
+                function(serialized) {
+                  _this.sdc[cacheKey] = serialized;
+                  return {
+                    fresh: true,
+                    data: serialized
+                  };
+                }
+              );
+            }
+          },
           {
             key: "_preflightRequest",
             value: function _preflightRequest(options) {
@@ -5788,12 +5912,14 @@
                               return this.pageLoader.getMiddlewareList();
                             case 4:
                               fns = _ctx.sent;
-                              requiresPreflight = fns.some(function(
-                                middleware
-                              ) {
+                              requiresPreflight = fns.some(function(param) {
+                                var _param = _slicedToArray(param, 2),
+                                  middleware = _param[0],
+                                  isSSR = _param[1];
                                 return (0, _routeMatcher).getRouteMatcher(
                                   (0, _getMiddlewareRegex).getMiddlewareRegex(
-                                    middleware
+                                    middleware,
+                                    !isSSR
                                   )
                                 )(cleanedAs);
                               });
@@ -5873,15 +5999,15 @@
                                   this.locales
                                 ).pathname
                               );
-                              var ref10;
-                              (ref10 = prepareUrlAs(
+                              var ref11;
+                              (ref11 = prepareUrlAs(
                                 this,
                                 cleanRedirect,
                                 cleanRedirect
                               )),
-                                (newUrl = ref10.url),
-                                (newAs = ref10.as),
-                                ref10;
+                                (newUrl = ref11.url),
+                                (newAs = ref11.as),
+                                ref11;
                               return _ctx.abrupt("return", {
                                 type: "redirect",
                                 newUrl: newUrl,
@@ -5893,7 +6019,7 @@
                                 destination: preflight.redirect
                               });
                             case 24:
-                              if (!preflight.refresh) {
+                              if (!(preflight.refresh && !preflight.ssr)) {
                                 _ctx.next = 26;
                                 break;
                               }
@@ -5921,7 +6047,7 @@
             key: "_getPreflightData",
             value: function _getPreflightData(params) {
               var _this = this,
-                _this1 = this;
+                _this2 = this;
               var preflightHref = params.preflightHref,
                 _shouldCache = params.shouldCache,
                 shouldCache = _shouldCache === void 0 ? false : _shouldCache;
@@ -5949,7 +6075,8 @@
                   return {
                     redirect: res.headers.get("Location"),
                     refresh: res.headers.has("x-middleware-refresh"),
-                    rewrite: res.headers.get("x-middleware-rewrite")
+                    rewrite: res.headers.get("x-middleware-rewrite"),
+                    ssr: !!res.headers.get("x-middleware-ssr")
                   };
                 })
                 .then(function(data) {
@@ -5959,7 +6086,7 @@
                   return data;
                 })
                 .catch(function(err) {
-                  delete _this1.sde[cacheKey];
+                  delete _this2.sde[cacheKey];
                   throw err;
                 });
             }
@@ -6131,25 +6258,29 @@
       });
       exports.getMiddlewareRegex = getMiddlewareRegex;
       var _routeRegex = __webpack_require__(4095);
-      function getMiddlewareRegex(normalizedRoute) {
+      function getMiddlewareRegex(normalizedRoute, param) {
+        var catchAll = param === void 0 ? true : param;
         var result = (0, _routeRegex).getParametrizedRoute(normalizedRoute);
+        var catchAllRegex = catchAll ? "(?!_next).*" : "";
+        var catchAllGroupedRegex = catchAll ? "(?:(/.*)?)" : "";
         if ("routeKeys" in result) {
           if (result.parameterizedRoute === "/") {
             return {
               groups: {},
-              namedRegex: "^/(?!_next).*$",
-              re: new RegExp("^/(?!_next).*$"),
+              namedRegex: "^/".concat(catchAllRegex, "$"),
+              re: new RegExp("^/".concat(catchAllRegex, "$")),
               routeKeys: {}
             };
           }
           return {
             groups: result.groups,
-            namedRegex: "^".concat(
-              result.namedParameterizedRoute,
-              "(?:(/.*)?)$"
-            ),
+            namedRegex: "^"
+              .concat(result.namedParameterizedRoute)
+              .concat(catchAllGroupedRegex, "$"),
             re: new RegExp(
-              "^".concat(result.parameterizedRoute, "(?:(/.*)?)$")
+              "^"
+                .concat(result.parameterizedRoute)
+                .concat(catchAllGroupedRegex, "$")
             ),
             routeKeys: result.routeKeys
           };
@@ -6157,12 +6288,16 @@
         if (result.parameterizedRoute === "/") {
           return {
             groups: {},
-            re: new RegExp("^/.*$")
+            re: new RegExp("^/".concat(catchAllRegex, "$"))
           };
         }
         return {
           groups: {},
-          re: new RegExp("^".concat(result.parameterizedRoute, "(?:(/.*)?)$"))
+          re: new RegExp(
+            "^"
+              .concat(result.parameterizedRoute)
+              .concat(catchAllGroupedRegex, "$")
+          )
         };
       } //# sourceMappingURL=get-middleware-regex.js.map
 
@@ -7693,6 +7828,301 @@
       /***/
     },
 
+    /***/ 9730: /***/ function(
+      __unused_webpack_module,
+      exports,
+      __webpack_require__
+    ) {
+      "use strict";
+      var __webpack_unused_export__;
+      /** @license React vundefined
+       * react-server-dom-webpack.production.min.js
+       *
+       * Copyright (c) Facebook, Inc. and its affiliates.
+       *
+       * This source code is licensed under the MIT license found in the
+       * LICENSE file in the root directory of this source tree.
+       */
+      function h(a) {
+        for (
+          var b = "https://reactjs.org/docs/error-decoder.html?invariant=" + a,
+            c = 1;
+          c < arguments.length;
+          c++
+        )
+          b += "&args[]=" + encodeURIComponent(arguments[c]);
+        return (
+          "Minified React error #" +
+          a +
+          "; visit " +
+          b +
+          " for the full message or use the non-minified dev environment for full errors and additional helpful warnings."
+        );
+      }
+      var k = { stream: !0 },
+        l = new Map(),
+        n = 60103,
+        q = 60116;
+      if ("function" === typeof Symbol && Symbol.for) {
+        var r = Symbol.for;
+        n = r("react.element");
+        q = r("react.lazy");
+      }
+      function t(a, b, c) {
+        this._status = a;
+        this._value = b;
+        this._response = c;
+      }
+      t.prototype.then = function(a) {
+        0 === this._status
+          ? (null === this._value && (this._value = []), this._value.push(a))
+          : a();
+      };
+      function u(a) {
+        switch (a._status) {
+          case 3:
+            return a._value;
+          case 1:
+            var b = JSON.parse(a._value, a._response._fromJSON);
+            a._status = 3;
+            return (a._value = b);
+          case 2:
+            b = a._value;
+            for (var c = b.chunks, d = 0; d < c.length; d++) {
+              var e = l.get(c[d]);
+              if (null !== e) throw e;
+            }
+            c = __webpack_require__(b.id);
+            b =
+              "*" === b.name
+                ? c
+                : "" === b.name
+                ? c.__esModule
+                  ? c.default
+                  : c
+                : c[b.name];
+            a._status = 3;
+            return (a._value = b);
+          case 0:
+            throw a;
+          default:
+            throw a._value;
+        }
+      }
+      function v() {
+        var a = w(this, 0);
+        return u(a);
+      }
+      function x(a, b) {
+        return new t(3, b, a);
+      }
+      function y(a) {
+        if (null !== a) for (var b = 0; b < a.length; b++) (0, a[b])();
+      }
+      function z(a, b) {
+        if (0 === a._status) {
+          var c = a._value;
+          a._status = 4;
+          a._value = b;
+          y(c);
+        }
+      }
+      function B(a, b) {
+        a._chunks.forEach(function(a) {
+          z(a, b);
+        });
+      }
+      function w(a, b) {
+        var c = a._chunks,
+          d = c.get(b);
+        d || ((d = new t(0, null, a)), c.set(b, d));
+        return d;
+      }
+      function C(a, b, c) {
+        switch (c[0]) {
+          case "$":
+            if ("$" === c) return n;
+            if ("$" === c[1] || "@" === c[1]) return c.substring(1);
+            b = parseInt(c.substring(1), 16);
+            a = w(a, b);
+            return u(a);
+          case "@":
+            return (
+              (b = parseInt(c.substring(1), 16)),
+              (a = w(a, b)),
+              { $$typeof: q, _payload: a, _init: u }
+            );
+        }
+        return c;
+      }
+      function D(a, b) {
+        if ("" !== b) {
+          var c = b[0],
+            d = b.indexOf(":", 1),
+            e = parseInt(b.substring(1, d), 16);
+          d = b.substring(d + 1);
+          switch (c) {
+            case "J":
+              b = a._chunks;
+              (c = b.get(e))
+                ? 0 === c._status &&
+                  ((a = c._value), (c._status = 1), (c._value = d), y(a))
+                : b.set(e, new t(1, d, a));
+              break;
+            case "M":
+              b = a._chunks;
+              c = b.get(e);
+              d = JSON.parse(d, a._fromJSON);
+              for (var p = d.chunks, g = 0; g < p.length; g++) {
+                var f = p[g];
+                if (void 0 === l.get(f)) {
+                  var A = __webpack_require__.e(f),
+                    m = l.set.bind(l, f, null),
+                    G = l.set.bind(l, f);
+                  A.then(m, G);
+                  l.set(f, A);
+                }
+              }
+              c
+                ? 0 === c._status &&
+                  ((a = c._value), (c._status = 2), (c._value = d), y(a))
+                : b.set(e, new t(2, d, a));
+              break;
+            case "S":
+              c = JSON.parse(d);
+              a._chunks.set(e, x(a, Symbol.for(c)));
+              break;
+            case "E":
+              b = JSON.parse(d);
+              c = Error(b.message);
+              c.stack = b.stack;
+              b = a._chunks;
+              (d = b.get(e)) ? z(d, c) : b.set(e, new t(4, c, a));
+              break;
+            default:
+              throw Error(h(415));
+          }
+        }
+      }
+      function E(a) {
+        return function(b, c) {
+          return "string" === typeof c
+            ? C(a, this, c)
+            : "object" === typeof c && null !== c
+            ? ((b =
+                c[0] === n
+                  ? {
+                      $$typeof: n,
+                      type: c[1],
+                      key: c[2],
+                      ref: null,
+                      props: c[3],
+                      _owner: null
+                    }
+                  : c),
+              b)
+            : c;
+        };
+      }
+      function F() {
+        var a = new TextDecoder();
+        a = {
+          _chunks: new Map(),
+          readRoot: v,
+          _partialRow: "",
+          _stringDecoder: a
+        };
+        a._fromJSON = E(a);
+        return a;
+      }
+      function H(a, b) {
+        function c(b) {
+          var g = b.value;
+          if (b.done) B(a, Error(h(412)));
+          else {
+            b = g;
+            g = a._stringDecoder;
+            for (var f = b.indexOf(10); -1 < f; ) {
+              var p = a._partialRow;
+              var m = b.subarray(0, f);
+              m = g.decode(m);
+              D(a, p + m);
+              a._partialRow = "";
+              b = b.subarray(f + 1);
+              f = b.indexOf(10);
+            }
+            a._partialRow += g.decode(b, k);
+            return e.read().then(c, d);
+          }
+        }
+        function d(b) {
+          B(a, b);
+        }
+        var e = b.getReader();
+        e.read().then(c, d);
+      }
+      exports.createFromFetch = function(a) {
+        var b = F();
+        a.then(
+          function(a) {
+            H(b, a.body);
+          },
+          function(a) {
+            B(b, a);
+          }
+        );
+        return b;
+      };
+      __webpack_unused_export__ = function(a) {
+        var b = F();
+        H(b, a);
+        return b;
+      };
+      __web
Post job cleanup.
[command]/usr/bin/git version
git version 2.33.1
[command]/usr/bin/git config --local --name-only --get-regexp core\.sshCommand
[command]/usr/bin/git submodule foreach --recursive git config --local --name-only --get-regexp 'core\.sshCommand' && git config --local --unset-all 'core.sshCommand' || :
[command]/usr/bin/git config --local --name-only --get-regexp http\.https\:\/\/github\.com\/\.extraheader
http.https://github.com/.extraheader
[command]/usr/bin/git config --local --unset-all http.https://github.com/.extraheader
[command]/usr/bin/git submodule foreach --recursive git config --local --name-only --get-regexp 'http\.https\:\/\/github\.com\/\.extraheader' && git config --local --unset-all 'http.https://github.com/.extraheader' || :
Cleaning up orphan processes
Commit: e88f26854fad3e978c8fc406a2780f830988ca13

@ijjk ijjk added the create-next-app Related to our CLI tool for quickly starting a new Next.js application. label Oct 26, 2021
@ijjk
Copy link
Member

ijjk commented Oct 26, 2021

Failing test suites

Commit: 183786c

test/integration/render-error-on-module-error/test/index.test.js

  • Module Init Error > should render error page
Expand output

● Module Init Error › should render error page

page.waitForSelector: Timeout 30000ms exceeded.
=========================== logs ===========================
waiting for selector "#error-p"
============================================================

  252 |     return this.chain(() => {
  253 |       return page
> 254 |         .waitForSelector(selector, { timeout, state: 'attached' })
      |          ^
  255 |         .then(async (el) => {
  256 |           // it seems selenium waits longer and tests rely on this behavior
  257 |           // so we wait for the load event fire before returning

  at lib/browsers/playwright.ts:254:10

test/integration/react-18/test/index.test.js

  • Concurrent mode > concurrentFeatures is enabled (dev) > should resolve suspense modules on server side if suspense
  • Concurrent mode > concurrentFeatures is enabled (dev) > should resolve suspense on server side if not suspended on server
  • Concurrent mode > concurrentFeatures is enabled (dev) > should resolve suspense on server side if suspended on server
  • Concurrent mode > concurrentFeatures is enabled (dev) > should hydrate suspenses on client side if suspended on server
  • Concurrent mode > concurrentFeatures is enabled (dev) > should drain the entire response
  • Concurrent mode > concurrentFeatures is enabled (dev) > should stream to users
  • Concurrent mode > concurrentFeatures is enabled (dev) > should not stream to bots
  • Concurrent mode > concurrentFeatures is enabled (prod) > should resolve suspense modules on server side if suspense
  • Concurrent mode > concurrentFeatures is enabled (prod) > should resolve suspense on server side if not suspended on server
  • Concurrent mode > concurrentFeatures is enabled (prod) > should resolve suspense on server side if suspended on server
  • Concurrent mode > concurrentFeatures is enabled (prod) > should hydrate suspenses on client side if suspended on server
  • Concurrent mode > concurrentFeatures is enabled (prod) > should drain the entire response
  • Concurrent mode > concurrentFeatures is enabled (prod) > should stream to users
  • Concurrent mode > concurrentFeatures is enabled (prod) > should not stream to bots
Expand output

● Concurrent mode › concurrentFeatures is enabled (dev) › should resolve suspense modules on server side if suspense

page.goto: Timeout 30000ms exceeded.
=========================== logs ===========================
navigating to "http://localhost:34833/suspense/no-preload", waiting until "load"
============================================================

  113 |       traceStarted = true
  114 |     }
> 115 |     await page.goto(url, { waitUntil: 'load' })
      |                ^
  116 |   }
  117 |
  118 |   back(): BrowserInterface {

  at Playwright.loadPage (lib/browsers/playwright.ts:115:16)
  at Object.webdriver [as default] (lib/next-webdriver.ts:83:3)
  at withBrowser (integration/react-18/test/concurrent.js:10:17)
  at Object.<anonymous> (integration/react-18/test/concurrent.js:20:5)

● Concurrent mode › concurrentFeatures is enabled (dev) › should resolve suspense on server side if not suspended on server

page.goto: Timeout 30000ms exceeded.
=========================== logs ===========================
navigating to "http://localhost:34833/suspense/no-thrown", waiting until "load"
============================================================

  113 |       traceStarted = true
  114 |     }
> 115 |     await page.goto(url, { waitUntil: 'load' })
      |                ^
  116 |   }
  117 |
  118 |   back(): BrowserInterface {

  at Playwright.loadPage (lib/browsers/playwright.ts:115:16)
  at Object.webdriver [as default] (lib/next-webdriver.ts:83:3)
  at withBrowser (integration/react-18/test/concurrent.js:10:17)
  at Object.<anonymous> (integration/react-18/test/concurrent.js:30:5)

● Concurrent mode › concurrentFeatures is enabled (dev) › should resolve suspense on server side if suspended on server

page.goto: Timeout 30000ms exceeded.
=========================== logs ===========================
navigating to "http://localhost:34833/suspense/thrown", waiting until "load"
============================================================

  113 |       traceStarted = true
  114 |     }
> 115 |     await page.goto(url, { waitUntil: 'load' })
      |                ^
  116 |   }
  117 |
  118 |   back(): BrowserInterface {

  at Playwright.loadPage (lib/browsers/playwright.ts:115:16)
  at Object.webdriver [as default] (lib/next-webdriver.ts:83:3)
  at withBrowser (integration/react-18/test/concurrent.js:10:17)
  at Object.<anonymous> (integration/react-18/test/concurrent.js:43:5)

● Concurrent mode › concurrentFeatures is enabled (dev) › should hydrate suspenses on client side if suspended on server

page.goto: Timeout 30000ms exceeded.
=========================== logs ===========================
navigating to "http://localhost:34833/suspense/thrown", waiting until "load"
============================================================

  113 |       traceStarted = true
  114 |     }
> 115 |     await page.goto(url, { waitUntil: 'load' })
      |                ^
  116 |   }
  117 |
  118 |   back(): BrowserInterface {

  at Playwright.loadPage (lib/browsers/playwright.ts:115:16)
  at Object.webdriver [as default] (lib/next-webdriver.ts:83:3)
  at withBrowser (integration/react-18/test/concurrent.js:10:17)
  at Object.<anonymous> (integration/react-18/test/concurrent.js:56:5)

● Concurrent mode › concurrentFeatures is enabled (dev) › should drain the entire response

page.goto: Timeout 30000ms exceeded.
=========================== logs ===========================
navigating to "http://localhost:34833/suspense/backpressure", waiting until "load"
============================================================

  113 |       traceStarted = true
  114 |     }
> 115 |     await page.goto(url, { waitUntil: 'load' })
      |                ^
  116 |   }
  117 |
  118 |   back(): BrowserInterface {

  at Playwright.loadPage (lib/browsers/playwright.ts:115:16)
  at Object.webdriver [as default] (lib/next-webdriver.ts:83:3)
  at withBrowser (integration/react-18/test/concurrent.js:10:17)
  at Object.<anonymous> (integration/react-18/test/concurrent.js:66:5)

● Concurrent mode › concurrentFeatures is enabled (dev) › should stream to users

thrown: "Exceeded timeout of 90000 ms for a test.
Use jest.setTimeout(newTimeout) to increase the timeout value, if this is a long-running test."

  168 |     concurrent(context, (p, q) => renderViaHTTP(context.appPort, p, q))
  169 |
> 170 |     it('should stream to users', async () => {
      |     ^
  171 |       const res = await fetchViaHTTP(context.appPort, '/ssr')
  172 |       expect(res.headers.get('etag')).toBeNull()
  173 |     })

  at integration/react-18/test/index.test.js:170:5
  at integration/react-18/test/index.test.js:210:5
  at runTest (integration/react-18/test/index.test.js:193:3)
  at runTests (integration/react-18/test/index.test.js:215:3)
  at integration/react-18/test/index.test.js:167:3
  at Object.<anonymous> (integration/react-18/test/index.test.js:152:1)

● Concurrent mode › concurrentFeatures is enabled (dev) › should not stream to bots

thrown: "Exceeded timeout of 90000 ms for a test.
Use jest.setTimeout(newTimeout) to increase the timeout value, if this is a long-running test."

  173 |     })
  174 |
> 175 |     it('should not stream to bots', async () => {
      |     ^
  176 |       const res = await fetchViaHTTP(
  177 |         context.appPort,
  178 |         '/ssr',

  at integration/react-18/test/index.test.js:175:5
  at integration/react-18/test/index.test.js:210:5
  at runTest (integration/react-18/test/index.test.js:193:3)
  at runTests (integration/react-18/test/index.test.js:215:3)
  at integration/react-18/test/index.test.js:167:3
  at Object.<anonymous> (integration/react-18/test/index.test.js:152:1)

● Concurrent mode › concurrentFeatures is enabled (prod) › should resolve suspense modules on server side if suspense

command failed with code 1

  174 |         code !== 0
  175 |       ) {
> 176 |         return reject(new Error(`command failed with code ${code}`))
      |                       ^
  177 |       }
  178 |
  179 |       resolve({

  at ChildProcess.<anonymous> (lib/next-test-utils.js:176:23)

● Concurrent mode › concurrentFeatures is enabled (prod) › should resolve suspense on server side if not suspended on server

command failed with code 1

  174 |         code !== 0
  175 |       ) {
> 176 |         return reject(new Error(`command failed with code ${code}`))
      |                       ^
  177 |       }
  178 |
  179 |       resolve({

  at ChildProcess.<anonymous> (lib/next-test-utils.js:176:23)

● Concurrent mode › concurrentFeatures is enabled (prod) › should resolve suspense on server side if suspended on server

command failed with code 1

  174 |         code !== 0
  175 |       ) {
> 176 |         return reject(new Error(`command failed with code ${code}`))
      |                       ^
  177 |       }
  178 |
  179 |       resolve({

  at ChildProcess.<anonymous> (lib/next-test-utils.js:176:23)

● Concurrent mode › concurrentFeatures is enabled (prod) › should hydrate suspenses on client side if suspended on server

command failed with code 1

  174 |         code !== 0
  175 |       ) {
> 176 |         return reject(new Error(`command failed with code ${code}`))
      |                       ^
  177 |       }
  178 |
  179 |       resolve({

  at ChildProcess.<anonymous> (lib/next-test-utils.js:176:23)

● Concurrent mode › concurrentFeatures is enabled (prod) › should drain the entire response

command failed with code 1

  174 |         code !== 0
  175 |       ) {
> 176 |         return reject(new Error(`command failed with code ${code}`))
      |                       ^
  177 |       }
  178 |
  179 |       resolve({

  at ChildProcess.<anonymous> (lib/next-test-utils.js:176:23)

● Concurrent mode › concurrentFeatures is enabled (prod) › should stream to users

command failed with code 1

  174 |         code !== 0
  175 |       ) {
> 176 |         return reject(new Error(`command failed with code ${code}`))
      |                       ^
  177 |       }
  178 |
  179 |       resolve({

  at ChildProcess.<anonymous> (lib/next-test-utils.js:176:23)

● Concurrent mode › concurrentFeatures is enabled (prod) › should not stream to bots

command failed with code 1

  174 |         code !== 0
  175 |       ) {
> 176 |         return reject(new Error(`command failed with code ${code}`))
      |                       ^
  177 |       }
  178 |
  179 |       resolve({

  at ChildProcess.<anonymous> (lib/next-test-utils.js:176:23)

● Test suite failed to run

TypeError: Cannot read property 'pid' of undefined

  329 | export async function killApp(instance) {
  330 |   await new Promise((resolve, reject) => {
> 331 |     treeKill(instance.pid, (err) => {
      |                       ^
  332 |       if (err) {
  333 |         if (
  334 |           process.platform === 'win32' &&

  at lib/next-test-utils.js:331:23
  at Object.killApp (lib/next-test-utils.js:330:9)
  at integration/react-18/test/index.test.js:15:25

@huozhi huozhi merged commit 5ddee44 into vercel:canary Oct 26, 2021
@huozhi huozhi deleted the shu/fa2e branch October 26, 2021 16:51
? // make sure importing "next" is handled gracefully for client
// bundles in case a user imported types and it wasn't removed
// TODO: should we warn/error for this instead?
['next']
{

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This turned out to be a breaking change for me extending webpackConfig.externals in my next.config.js, as this was always an iterable in the past but now it can be an un-interable object

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
create-next-app Related to our CLI tool for quickly starting a new Next.js application. created-by: Next.js team PRs by the Next.js team. type: next
Projects
None yet
Development

Successfully merging this pull request may close these issues.

7 participants