Separate viewport and metadata in rsc and cache #73867

huozhi · 2024-12-12T21:29:32Z

What

Separate the viewport from the metadata rendering tree and client cache, to separate viewport handling and metadata. This is the preparation work for async metadata work. The viewport will still remain blocking and metadata can be non-blocking.

This PR separates the rendering side into two elements ViewportTree and MetadataTree.
And changed the rsc head data into an array with length 2 containing both viewport and metadata, also the client cache side we updated the cache type as well

Closes NDX-543

array head

ijjk · 2024-12-12T21:37:00Z

Tests Passed

ijjk · 2024-12-12T21:52:09Z

Stats from current PR

Default Build (Increase detected ⚠️)

General

	vercel/next.js canary	vercel/next.js 12-06-separate_viewport_and_metadata	Change
buildDuration	20.3s	22.3s	⚠️ +2s
buildDurationCached	17.3s	14.9s	N/A
nodeModulesSize	410 MB	410 MB	N/A
nextStartRea..uration (ms)	512ms	518ms	N/A

Client Bundles (main, webpack)

	vercel/next.js canary	vercel/next.js 12-06-separate_viewport_and_metadata	Change
1187-HASH.js gzip	50.9 kB	50.8 kB	N/A
8276.HASH.js gzip	169 B	168 B	N/A
8377-HASH.js gzip	5.36 kB	5.36 kB	N/A
bccd1874-HASH.js gzip	53 kB	53 kB	N/A
framework-HASH.js gzip	57.5 kB	57.5 kB	N/A
main-app-HASH.js gzip	233 B	235 B	N/A
main-HASH.js gzip	34.1 kB	34 kB	N/A
webpack-HASH.js gzip	1.71 kB	1.71 kB	N/A
Overall change	0 B	0 B	✓

Legacy Client Bundles (polyfills)

	vercel/next.js canary	vercel/next.js 12-06-separate_viewport_and_metadata	Change
polyfills-HASH.js gzip	39.4 kB	39.4 kB	✓
Overall change	39.4 kB	39.4 kB	✓

Client Pages

	vercel/next.js canary	vercel/next.js 12-06-separate_viewport_and_metadata	Change
_app-HASH.js gzip	193 B	193 B	✓
_error-HASH.js gzip	193 B	193 B	✓
amp-HASH.js gzip	512 B	510 B	N/A
css-HASH.js gzip	343 B	342 B	N/A
dynamic-HASH.js gzip	1.84 kB	1.84 kB	✓
edge-ssr-HASH.js gzip	265 B	265 B	✓
head-HASH.js gzip	363 B	362 B	N/A
hooks-HASH.js gzip	393 B	392 B	N/A
image-HASH.js gzip	4.49 kB	4.49 kB	N/A
index-HASH.js gzip	268 B	268 B	✓
link-HASH.js gzip	2.35 kB	2.34 kB	N/A
routerDirect..HASH.js gzip	328 B	328 B	✓
script-HASH.js gzip	397 B	397 B	✓
withRouter-HASH.js gzip	323 B	326 B	N/A
1afbb74e6ecf..834.css gzip	106 B	106 B	✓
Overall change	3.59 kB	3.59 kB	✓

Client Build Manifests

	vercel/next.js canary	vercel/next.js 12-06-separate_viewport_and_metadata	Change
_buildManifest.js gzip	749 B	746 B	N/A
Overall change	0 B	0 B	✓

Rendered Page Sizes

	vercel/next.js canary	vercel/next.js 12-06-separate_viewport_and_metadata	Change
index.html gzip	523 B	522 B	N/A
link.html gzip	538 B	537 B	N/A
withRouter.html gzip	518 B	519 B	N/A
Overall change	0 B	0 B	✓

Edge SSR bundle Size

	vercel/next.js canary	vercel/next.js 12-06-separate_viewport_and_metadata	Change
edge-ssr.js gzip	128 kB	128 kB	N/A
page.js gzip	204 kB	203 kB	N/A
Overall change	0 B	0 B	✓

Middleware size

	vercel/next.js canary	vercel/next.js 12-06-separate_viewport_and_metadata	Change
middleware-b..fest.js gzip	670 B	668 B	N/A
middleware-r..fest.js gzip	155 B	156 B	N/A
middleware.js gzip	31.2 kB	31.2 kB	N/A
edge-runtime..pack.js gzip	844 B	844 B	✓
Overall change	844 B	844 B	✓

Next Runtimes

	vercel/next.js canary	vercel/next.js 12-06-separate_viewport_and_metadata	Change
523-experime...dev.js gzip	322 B	322 B	✓
523.runtime.dev.js gzip	314 B	314 B	✓
app-page-exp...dev.js gzip	323 kB	323 kB	N/A
app-page-exp..prod.js gzip	127 kB	127 kB	N/A
app-page-tur..prod.js gzip	140 kB	140 kB	N/A
app-page-tur..prod.js gzip	135 kB	135 kB	N/A
app-page.run...dev.js gzip	313 kB	313 kB	N/A
app-page.run..prod.js gzip	123 kB	123 kB	N/A
app-route-ex...dev.js gzip	37.4 kB	37.3 kB	N/A
app-route-ex..prod.js gzip	25.5 kB	25.4 kB	N/A
app-route-tu..prod.js gzip	25.5 kB	25.4 kB	N/A
app-route-tu..prod.js gzip	25.3 kB	25.2 kB	N/A
app-route.ru...dev.js gzip	39 kB	38.9 kB	N/A
app-route.ru..prod.js gzip	25.3 kB	25.2 kB	N/A
pages-api-tu..prod.js gzip	9.69 kB	9.67 kB	N/A
pages-api.ru...dev.js gzip	11.6 kB	11.6 kB	N/A
pages-api.ru..prod.js gzip	9.68 kB	9.66 kB	N/A
pages-turbo...prod.js gzip	21.7 kB	21.7 kB	N/A
pages.runtim...dev.js gzip	27.4 kB	27.4 kB	N/A
pages.runtim..prod.js gzip	21.7 kB	21.7 kB	N/A
server.runti..prod.js gzip	916 kB	916 kB	N/A
Overall change	636 B	636 B	✓

build cache Overall increase ⚠️

	vercel/next.js canary	vercel/next.js 12-06-separate_viewport_and_metadata	Change
0.pack gzip	2.05 MB	2.05 MB	⚠️ +1.94 kB
index.pack gzip	73 kB	72.2 kB	N/A
Overall change	2.05 MB	2.05 MB	⚠️ +1.94 kB

Diff details

Diff for middleware.js

Diff too large to display

Diff for edge-ssr.js

Diff too large to display

Diff for image-HASH.js

@@ -1,7 +1,7 @@
 (self["webpackChunk_N_E"] = self["webpackChunk_N_E"] || []).push([
   [2983],
   {
-    /***/ 3705: /***/ (
+    /***/ 8255: /***/ (
       __unused_webpack_module,
       __unused_webpack_exports,
       __webpack_require__
@@ -9,7 +9,7 @@
       (window.__NEXT_P = window.__NEXT_P || []).push([
         "/image",
         function () {
-          return __webpack_require__(8448);
+          return __webpack_require__(8926);
         },
       ]);
       if (false) {
@@ -18,7 +18,7 @@
       /***/
     },
 
-    /***/ 7342: /***/ (module, exports, __webpack_require__) => {
+    /***/ 4369: /***/ (module, exports, __webpack_require__) => {
       "use strict";
       /* __next_internal_client_entry_do_not_use__  cjs */
       Object.defineProperty(exports, "__esModule", {
@@ -40,17 +40,17 @@
         __webpack_require__(6049)
       );
       const _head = /*#__PURE__*/ _interop_require_default._(
-        __webpack_require__(7196)
+        __webpack_require__(956)
       );
-      const _getimgprops = __webpack_require__(2661);
-      const _imageconfig = __webpack_require__(72);
-      const _imageconfigcontextsharedruntime = __webpack_require__(6386);
-      const _warnonce = __webpack_require__(4496);
-      const _routercontextsharedruntime = __webpack_require__(6443);
+      const _getimgprops = __webpack_require__(485);
+      const _imageconfig = __webpack_require__(4664);
+      const _imageconfigcontextsharedruntime = __webpack_require__(1250);
+      const _warnonce = __webpack_require__(1648);
+      const _routercontextsharedruntime = __webpack_require__(907);
       const _imageloader = /*#__PURE__*/ _interop_require_default._(
-        __webpack_require__(3433)
+        __webpack_require__(6489)
       );
-      const _usemergedref = __webpack_require__(1942);
+      const _usemergedref = __webpack_require__(5942);
       // This is replaced by webpack define plugin
       const configEnv = {
         deviceSizes: [640, 750, 828, 1080, 1200, 1920, 2048, 3840],
@@ -371,7 +371,7 @@
       /***/
     },
 
-    /***/ 1942: /***/ (module, exports, __webpack_require__) => {
+    /***/ 5942: /***/ (module, exports, __webpack_require__) => {
       "use strict";
 
       Object.defineProperty(exports, "__esModule", {
@@ -432,7 +432,7 @@
       /***/
     },
 
-    /***/ 2661: /***/ (
+    /***/ 485: /***/ (
       __unused_webpack_module,
       exports,
       __webpack_require__
@@ -448,9 +448,9 @@
           return getImgProps;
         },
       });
-      const _warnonce = __webpack_require__(4496);
-      const _imageblursvg = __webpack_require__(4796);
-      const _imageconfig = __webpack_require__(72);
+      const _warnonce = __webpack_require__(1648);
+      const _imageblursvg = __webpack_require__(4812);
+      const _imageconfig = __webpack_require__(4664);
       const VALID_LOADING_VALUES =
         /* unused pure expression or super */ null && [
           "lazy",
@@ -623,7 +623,7 @@
             ),
             "__NEXT_ERROR_CODE",
             {
-              value: "E163",
+              value: "E165",
               enumerable: false,
             }
           );
@@ -646,7 +646,7 @@
               ),
               "__NEXT_ERROR_CODE",
               {
-                value: "E252",
+                value: "E255",
                 enumerable: false,
               }
             );
@@ -706,7 +706,7 @@
               ),
               "__NEXT_ERROR_CODE",
               {
-                value: "E460",
+                value: "E464",
                 enumerable: false,
               }
             );
@@ -719,7 +719,7 @@
               ),
               "__NEXT_ERROR_CODE",
               {
-                value: "E48",
+                value: "E50",
                 enumerable: false,
               }
             );
@@ -852,7 +852,7 @@
       /***/
     },
 
-    /***/ 4796: /***/ (__unused_webpack_module, exports) => {
+    /***/ 4812: /***/ (__unused_webpack_module, exports) => {
       "use strict";
       /**
        * A shared function, used on both client and server, to generate a SVG blur placeholder.
@@ -907,7 +907,7 @@
       /***/
     },
 
-    /***/ 1969: /***/ (
+    /***/ 8273: /***/ (
       __unused_webpack_module,
       exports,
       __webpack_require__
@@ -934,10 +934,10 @@
         },
       });
       const _interop_require_default = __webpack_require__(173);
-      const _getimgprops = __webpack_require__(2661);
-      const _imagecomponent = __webpack_require__(7342);
+      const _getimgprops = __webpack_require__(485);
+      const _imagecomponent = __webpack_require__(4369);
       const _imageloader = /*#__PURE__*/ _interop_require_default._(
-        __webpack_require__(3433)
+        __webpack_require__(6489)
       );
       function getImageProps(imgProps) {
         const { props } = (0, _getimgprops.getImgProps)(imgProps, {
@@ -969,7 +969,7 @@
       /***/
     },
 
-    /***/ 3433: /***/ (__unused_webpack_module, exports) => {
+    /***/ 6489: /***/ (__unused_webpack_module, exports) => {
       "use strict";
 
       Object.defineProperty(exports, "__esModule", {
@@ -1004,7 +1004,7 @@
       /***/
     },
 
-    /***/ 8448: /***/ (
+    /***/ 8926: /***/ (
       __unused_webpack_module,
       __webpack_exports__,
       __webpack_require__
@@ -1021,8 +1021,8 @@
 
       // EXTERNAL MODULE: ./node_modules/.pnpm/[email protected]/node_modules/react/jsx-runtime.js
       var jsx_runtime = __webpack_require__(5105);
-      // EXTERNAL MODULE: ./node_modules/.pnpm/next@[email protected][email protected][email protected]/node_modules/next/image.js
-      var next_image = __webpack_require__(8140);
+      // EXTERNAL MODULE: ./node_modules/.pnpm/next@[email protected][email protected][email protected]/node_modules/next/image.js
+      var next_image = __webpack_require__(5434);
       var image_default = /*#__PURE__*/ __webpack_require__.n(next_image); // ./pages/nextjs.png
       /* harmony default export */ const nextjs = {
         src: "/_next/static/media/nextjs.cae0b805.png",
@@ -1052,12 +1052,12 @@
       /***/
     },
 
-    /***/ 8140: /***/ (
+    /***/ 5434: /***/ (
       module,
       __unused_webpack_exports,
       __webpack_require__
     ) => {
-      module.exports = __webpack_require__(1969);
+      module.exports = __webpack_require__(8273);
 
       /***/
     },
@@ -1067,7 +1067,7 @@
     /******/ var __webpack_exec__ = (moduleId) =>
       __webpack_require__((__webpack_require__.s = moduleId));
     /******/ __webpack_require__.O(0, [636, 6593, 8792], () =>
-      __webpack_exec__(3705)
+      __webpack_exec__(8255)
     );
     /******/ var __webpack_exports__ = __webpack_require__.O();
     /******/ _N_E = __webpack_exports__;

Diff for 1187-HASH.js

Diff too large to display

Diff for 8377-HASH.js

@@ -1,8 +1,8 @@
 "use strict";
 (self["webpackChunk_N_E"] = self["webpackChunk_N_E"] || []).push([
-  [8377],
+  [2727],
   {
-    /***/ 8377: /***/ (module, exports, __webpack_require__) => {
+    /***/ 2727: /***/ (module, exports, __webpack_require__) => {
       /* __next_internal_client_entry_do_not_use__  cjs */
       Object.defineProperty(exports, "__esModule", {
         value: true,
@@ -13,27 +13,27 @@
           return Image;
         },
       });
-      const _interop_require_default = __webpack_require__(2952);
-      const _interop_require_wildcard = __webpack_require__(333);
-      const _jsxruntime = __webpack_require__(3094);
+      const _interop_require_default = __webpack_require__(384);
+      const _interop_require_wildcard = __webpack_require__(4261);
+      const _jsxruntime = __webpack_require__(7048);
       const _react = /*#__PURE__*/ _interop_require_wildcard._(
-        __webpack_require__(1446)
+        __webpack_require__(228)
       );
       const _reactdom = /*#__PURE__*/ _interop_require_default._(
-        __webpack_require__(8307)
+        __webpack_require__(9221)
       );
       const _head = /*#__PURE__*/ _interop_require_default._(
-        __webpack_require__(8050)
+        __webpack_require__(1116)
       );
-      const _getimgprops = __webpack_require__(3201);
-      const _imageconfig = __webpack_require__(6678);
-      const _imageconfigcontextsharedruntime = __webpack_require__(578);
-      const _warnonce = __webpack_require__(1971);
-      const _routercontextsharedruntime = __webpack_require__(7795);
+      const _getimgprops = __webpack_require__(5763);
+      const _imageconfig = __webpack_require__(6224);
+      const _imageconfigcontextsharedruntime = __webpack_require__(6720);
+      const _warnonce = __webpack_require__(894);
+      const _routercontextsharedruntime = __webpack_require__(9093);
       const _imageloader = /*#__PURE__*/ _interop_require_default._(
-        __webpack_require__(1315)
+        __webpack_require__(2809)
       );
-      const _usemergedref = __webpack_require__(592);
+      const _usemergedref = __webpack_require__(1329);
       // This is replaced by webpack define plugin
       const configEnv = {
         deviceSizes: [640, 750, 828, 1080, 1200, 1920, 2048, 3840],
@@ -355,7 +355,7 @@
       /***/
     },
 
-    /***/ 592: /***/ (module, exports, __webpack_require__) => {
+    /***/ 1329: /***/ (module, exports, __webpack_require__) => {
       Object.defineProperty(exports, "__esModule", {
         value: true,
       });
@@ -365,7 +365,7 @@
           return useMergedRef;
         },
       });
-      const _react = __webpack_require__(1446);
+      const _react = __webpack_require__(228);
       function useMergedRef(refA, refB) {
         const cleanupA = (0, _react.useRef)(() => {});
         const cleanupB = (0, _react.useRef)(() => {});
@@ -414,7 +414,7 @@
       /***/
     },
 
-    /***/ 5318: /***/ (
+    /***/ 272: /***/ (
       __unused_webpack_module,
       exports,
       __webpack_require__
@@ -428,9 +428,9 @@
           return AmpStateContext;
         },
       });
-      const _interop_require_default = __webpack_require__(2952);
+      const _interop_require_default = __webpack_require__(384);
       const _react = /*#__PURE__*/ _interop_require_default._(
-        __webpack_require__(1446)
+        __webpack_require__(228)
       );
       const AmpStateContext = _react.default.createContext({});
       if (false) {
@@ -439,7 +439,7 @@
       /***/
     },
 
-    /***/ 1210: /***/ (__unused_webpack_module, exports) => {
+    /***/ 1467: /***/ (__unused_webpack_module, exports) => {
       Object.defineProperty(exports, "__esModule", {
         value: true,
       });
@@ -461,7 +461,7 @@
       /***/
     },
 
-    /***/ 3201: /***/ (
+    /***/ 5763: /***/ (
       __unused_webpack_module,
       exports,
       __webpack_require__
@@ -475,9 +475,9 @@
           return getImgProps;
         },
       });
-      const _warnonce = __webpack_require__(1971);
-      const _imageblursvg = __webpack_require__(3482);
-      const _imageconfig = __webpack_require__(6678);
+      const _warnonce = __webpack_require__(894);
+      const _imageblursvg = __webpack_require__(5868);
+      const _imageconfig = __webpack_require__(6224);
       const VALID_LOADING_VALUES =
         /* unused pure expression or super */ null && [
           "lazy",
@@ -650,7 +650,7 @@
             ),
             "__NEXT_ERROR_CODE",
             {
-              value: "E163",
+              value: "E165",
               enumerable: false,
             }
           );
@@ -673,7 +673,7 @@
               ),
               "__NEXT_ERROR_CODE",
               {
-                value: "E252",
+                value: "E255",
                 enumerable: false,
               }
             );
@@ -733,7 +733,7 @@
               ),
               "__NEXT_ERROR_CODE",
               {
-                value: "E460",
+                value: "E464",
                 enumerable: false,
               }
             );
@@ -746,7 +746,7 @@
               ),
               "__NEXT_ERROR_CODE",
               {
-                value: "E48",
+                value: "E50",
                 enumerable: false,
               }
             );
@@ -879,8 +879,8 @@
       /***/
     },
 
-    /***/ 8050: /***/ (module, exports, __webpack_require__) => {
-      /* provided dependency */ var process = __webpack_require__(6611);
+    /***/ 1116: /***/ (module, exports, __webpack_require__) => {
+      /* provided dependency */ var process = __webpack_require__(9829);
       /* __next_internal_client_entry_do_not_use__  cjs */
       Object.defineProperty(exports, "__esModule", {
         value: true,
@@ -901,19 +901,19 @@
           return defaultHead;
         },
       });
-      const _interop_require_default = __webpack_require__(2952);
-      const _interop_require_wildcard = __webpack_require__(333);
-      const _jsxruntime = __webpack_require__(3094);
+      const _interop_require_default = __webpack_require__(384);
+      const _interop_require_wildcard = __webpack_require__(4261);
+      const _jsxruntime = __webpack_require__(7048);
       const _react = /*#__PURE__*/ _interop_require_wildcard._(
-        __webpack_require__(1446)
+        __webpack_require__(228)
       );
       const _sideeffect = /*#__PURE__*/ _interop_require_default._(
-        __webpack_require__(4607)
+        __webpack_require__(4101)
       );
-      const _ampcontextsharedruntime = __webpack_require__(5318);
-      const _headmanagercontextsharedruntime = __webpack_require__(7060);
-      const _ampmode = __webpack_require__(1210);
-      const _warnonce = __webpack_require__(1971);
+      const _ampcontextsharedruntime = __webpack_require__(272);
+      const _headmanagercontextsharedruntime = __webpack_require__(1790);
+      const _ampmode = __webpack_require__(1467);
+      const _warnonce = __webpack_require__(894);
       function defaultHead(inAmpMode) {
         if (inAmpMode === void 0) inAmpMode = false;
         const head = [
@@ -1097,7 +1097,7 @@
       /***/
     },
 
-    /***/ 3482: /***/ (__unused_webpack_module, exports) => {
+    /***/ 5868: /***/ (__unused_webpack_module, exports) => {
       /**
        * A shared function, used on both client and server, to generate a SVG blur placeholder.
        */
@@ -1151,7 +1151,7 @@
       /***/
     },
 
-    /***/ 578: /***/ (
+    /***/ 6720: /***/ (
       __unused_webpack_module,
       exports,
       __webpack_require__
@@ -1165,11 +1165,11 @@
           return ImageConfigContext;
         },
       });
-      const _interop_require_default = __webpack_require__(2952);
+      const _interop_require_default = __webpack_require__(384);
       const _react = /*#__PURE__*/ _interop_require_default._(
-        __webpack_require__(1446)
+        __webpack_require__(228)
       );
-      const _imageconfig = __webpack_require__(6678);
+      const _imageconfig = __webpack_require__(6224);
       const ImageConfigContext = _react.default.createContext(
         _imageconfig.imageConfigDefault
       );
@@ -1179,7 +1179,7 @@
       /***/
     },
 
-    /***/ 6678: /***/ (__unused_webpack_module, exports) => {
+    /***/ 6224: /***/ (__unused_webpack_module, exports) => {
       Object.defineProperty(exports, "__esModule", {
         value: true,
       });
@@ -1227,7 +1227,7 @@
       /***/
     },
 
-    /***/ 1315: /***/ (__unused_webpack_module, exports) => {
+    /***/ 2809: /***/ (__unused_webpack_module, exports) => {
       Object.defineProperty(exports, "__esModule", {
         value: true,
       });
@@ -1260,7 +1260,7 @@
       /***/
     },
 
-    /***/ 7795: /***/ (
+    /***/ 9093: /***/ (
       __unused_webpack_module,
       exports,
       __webpack_require__
@@ -1274,9 +1274,9 @@
           return RouterContext;
         },
       });
-      const _interop_require_default = __webpack_require__(2952);
+      const _interop_require_default = __webpack_require__(384);
       const _react = /*#__PURE__*/ _interop_require_default._(
-        __webpack_require__(1446)
+        __webpack_require__(228)
       );
       const RouterContext = _react.default.createContext(null);
       if (false) {
@@ -1285,7 +1285,7 @@
       /***/
     },
 
-    /***/ 4607: /***/ (
+    /***/ 4101: /***/ (
       __unused_webpack_module,
       exports,
       __webpack_require__
@@ -1299,7 +1299,7 @@
           return SideEffect;
         },
       });
-      const _react = __webpack_require__(1446);
+      const _react = __webpack_require__(228);
       const isServer = typeof window === "undefined";
       const useClientOnlyLayoutEffect = isServer
         ? () => {}

Diff for main-HASH.js

Diff too large to display

Diff for app-page-exp..ntime.dev.js

failed to diff

Diff for app-page-exp..time.prod.js

Diff too large to display

Diff for app-page-tur..time.prod.js

Diff too large to display

Diff for app-page-tur..time.prod.js

Diff too large to display

Diff for app-page.runtime.dev.js

failed to diff

Diff for app-page.runtime.prod.js

Diff too large to display

Diff for app-route-ex..ntime.dev.js

Diff too large to display

Diff for app-route-ex..time.prod.js

Diff too large to display

Diff for app-route-tu..time.prod.js

Diff too large to display

Diff for app-route-tu..time.prod.js

Diff too large to display

Diff for app-route.runtime.dev.js

Diff too large to display

Diff for app-route.ru..time.prod.js

Diff too large to display

Diff for pages-api-tu..time.prod.js

Diff too large to display

Diff for pages-api.runtime.dev.js

Diff too large to display

Diff for pages-api.ru..time.prod.js

Diff too large to display

Diff for pages-turbo...time.prod.js

Diff too large to display

Diff for pages.runtime.dev.js

Diff too large to display

Diff for pages.runtime.prod.js

Diff too large to display

Diff for server.runtime.prod.js

Diff too large to display

Commit: a877379

packages/next/src/client/components/router-reducer/ppr-navigations.ts

packages/next/src/lib/metadata/metadata.tsx

ztanner · 2024-12-13T00:29:29Z

packages/next/src/shared/lib/app-router-context.shared-runtime.ts

-  head: React.ReactNode
+
+  /** metadata cache nodes, [viewport, metadata] */
+  head: [React.ReactNode, React.ReactNode]


maybe worth extracting into a shared type for all the spots where we re-create the type? Would potentially have the added benefit of allowing us to comment on what the significance of the tuple ordering is in a single place

Created a new HeadData type for this case. React.ReactNode also contains null hence I replaced the [ReactNode | null, ReactNode | null] case with this as well

huozhi · 2024-12-13T21:01:37Z

packages/next/src/client/components/router-reducer/fill-lazy-items-till-leaf-with-head.ts

@@ -14,8 +17,8 @@ export function fillLazyItemsTillLeafWithHead(
  existingCache: CacheNode | undefined,
  routerState: FlightRouterState,
  cacheNodeSeedData: CacheNodeSeedData | null,
-  head: React.ReactNode,
-  prefetchEntry?: PrefetchCacheEntry


this change is to avoid accidentally passing the wrong argument since they got the similar types, to ensure you always pass the args correctly

ijjk added created-by: Next.js team PRs by the Next.js team. type: next labels Dec 12, 2024

huozhi added 2 commits December 12, 2024 22:34

separate viewport and metadata

ab14892

array head

clean up types

a510ad9

huozhi force-pushed the 12-06-separate_viewport_and_metadata branch from d683bc4 to a510ad9 Compare December 12, 2024 21:34

update test

9b60312

huozhi marked this pull request as ready for review December 12, 2024 22:01

ztanner reviewed Dec 13, 2024

View reviewed changes

create shared head type

3faa115

huozhi requested a review from ztanner December 13, 2024 20:59

huozhi commented Dec 13, 2024

View reviewed changes

huozhi changed the title ~~refactor: separate viewport and metadata in rsc and cache~~ Separate viewport and metadata in rsc and cache Dec 14, 2024

replace node | null

a877379

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Separate viewport and metadata in rsc and cache #73867

Separate viewport and metadata in rsc and cache #73867

huozhi commented Dec 12, 2024

ijjk commented Dec 12, 2024 •

edited

Loading

ijjk commented Dec 12, 2024 •

edited

Loading

ztanner Dec 13, 2024

huozhi Dec 13, 2024

huozhi Dec 13, 2024

Separate viewport and metadata in rsc and cache #73867

Are you sure you want to change the base?

Separate viewport and metadata in rsc and cache #73867

Conversation

huozhi commented Dec 12, 2024

What

ijjk commented Dec 12, 2024 • edited Loading

Tests Passed

ijjk commented Dec 12, 2024 • edited Loading

Stats from current PR

ztanner Dec 13, 2024

Choose a reason for hiding this comment

huozhi Dec 13, 2024

Choose a reason for hiding this comment

huozhi Dec 13, 2024

Choose a reason for hiding this comment

ijjk commented Dec 12, 2024 •

edited

Loading

ijjk commented Dec 12, 2024 •

edited

Loading