Register Suspense retry handlers in commit phase (#31667)

To avoid GC pressure and accidentally hanging onto old trees Suspense boundary retries are now implemented in the commit phase. I used the Callback flag which was previously only used to schedule callbacks for Class components. This isn't quite semantically equivalent but it's unused and seemingly compatible. DiffTrain build for [de68d2f](de68d2f)
facebook · Dec 4, 2024 · a3b4387 · a3b4387
1 parent 73566a7
commit a3b4387
Show file tree

Hide file tree

Showing 23 changed files with 697 additions and 631 deletions.
diff --git a/compiled-rn/VERSION_NATIVE_FB b/compiled-rn/VERSION_NATIVE_FB
@@ -1 +1 @@
-19.0.0-native-fb-16d2bbbd-20241203
+19.0.0-native-fb-de68d2f4-20241204
diff --git a/...iled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react/react-dom/cjs/ReactDOM-dev.js b/...iled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react/react-dom/cjs/ReactDOM-dev.js
@@ -7,7 +7,7 @@
  * @noflow
  * @nolint
  * @preventMunge
- * @generated SignedSource<<cbb4fb73c9e1ccc01854e808c548f830>>
+ * @generated SignedSource<<160a11128267704309b6ab8a4178e177>>
  */
 
 "use strict";
@@ -420,5 +420,5 @@ __DEV__ &&
     exports.useFormStatus = function () {
       return resolveDispatcher().useHostTransitionStatus();
     };
-    exports.version = "19.0.0-native-fb-16d2bbbd-20241203";
+    exports.version = "19.0.0-native-fb-de68d2f4-20241204";
   })();
diff --git a/...led-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react/react-dom/cjs/ReactDOM-prod.js b/...led-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react/react-dom/cjs/ReactDOM-prod.js
@@ -7,7 +7,7 @@
  * @noflow
  * @nolint
  * @preventMunge
- * @generated SignedSource<<239a11226e90f84bbe038aeaaca66638>>
+ * @generated SignedSource<<4ab67f1597a97138a25ba4aa51a83988>>
  */
 
 "use strict";
@@ -203,4 +203,4 @@ exports.useFormState = function (action, initialState, permalink) {
 exports.useFormStatus = function () {
   return ReactSharedInternals.H.useHostTransitionStatus();
 };
-exports.version = "19.0.0-native-fb-16d2bbbd-20241203";
+exports.version = "19.0.0-native-fb-de68d2f4-20241204";
diff --git a/...n/facebook-fbsource/xplat/js/RKJSModules/vendor/react/react-dom/cjs/ReactDOM-profiling.js b/...n/facebook-fbsource/xplat/js/RKJSModules/vendor/react/react-dom/cjs/ReactDOM-profiling.js
@@ -7,7 +7,7 @@
  * @noflow
  * @nolint
  * @preventMunge
- * @generated SignedSource<<239a11226e90f84bbe038aeaaca66638>>
+ * @generated SignedSource<<4ab67f1597a97138a25ba4aa51a83988>>
  */
 
 "use strict";
@@ -203,4 +203,4 @@ exports.useFormState = function (action, initialState, permalink) {
 exports.useFormStatus = function () {
   return ReactSharedInternals.H.useHostTransitionStatus();
 };
-exports.version = "19.0.0-native-fb-16d2bbbd-20241203";
+exports.version = "19.0.0-native-fb-de68d2f4-20241204";
diff --git a/...n/facebook-fbsource/xplat/js/RKJSModules/vendor/react/react-dom/cjs/ReactDOMClient-dev.js b/...n/facebook-fbsource/xplat/js/RKJSModules/vendor/react/react-dom/cjs/ReactDOMClient-dev.js
diff --git a/.../facebook-fbsource/xplat/js/RKJSModules/vendor/react/react-dom/cjs/ReactDOMClient-prod.js b/.../facebook-fbsource/xplat/js/RKJSModules/vendor/react/react-dom/cjs/ReactDOMClient-prod.js
@@ -7,7 +7,7 @@
  * @noflow
  * @nolint
  * @preventMunge
- * @generated SignedSource<<f21aeede2360fa78702f7e00ba0891d5>>
+ * @generated SignedSource<<e6dc49083d7f6b1d3dcd756ba7a07031>>
  */
 
 /*
@@ -6657,13 +6657,8 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) {
       );
     } else
       "$?" === nextInstance.data
-        ? ((workInProgress.flags |= 128),
+        ? ((workInProgress.flags |= 192),
           (workInProgress.child = current.child),
-          (workInProgress = retryDehydratedSuspenseBoundary.bind(
-            null,
-            current
-          )),
-          registerSuspenseInstanceRetry(nextInstance, workInProgress),
           (workInProgress = null))
         : ((renderLanes = JSCompiler_temp$jscomp$0.treeContext),
           (nextHydratableInstance = getNextHydratable(
@@ -8528,6 +8523,16 @@ function commitLayoutEffectOnFiber(finishedRoot, current, finishedWork) {
     case 13:
       recursivelyTraverseLayoutEffects(finishedRoot, finishedWork);
       flags & 4 && commitSuspenseHydrationCallbacks(finishedRoot, finishedWork);
+      flags & 64 &&
+        ((flags = finishedWork.memoizedState),
+        null !== flags &&
+          ((flags = flags.dehydrated),
+          null !== flags &&
+            ((finishedWork = retryDehydratedSuspenseBoundary.bind(
+              null,
+              finishedWork
+            )),
+            registerSuspenseInstanceRetry(flags, finishedWork))));
       break;
     case 22:
       if (0 !== (finishedWork.mode & 1)) {
@@ -12352,20 +12357,20 @@ function extractEvents$1(
   }
 }
 for (
-  var i$jscomp$inline_1489 = 0;
-  i$jscomp$inline_1489 < simpleEventPluginEvents.length;
-  i$jscomp$inline_1489++
+  var i$jscomp$inline_1488 = 0;
+  i$jscomp$inline_1488 < simpleEventPluginEvents.length;
+  i$jscomp$inline_1488++
 ) {
-  var eventName$jscomp$inline_1490 =
-      simpleEventPluginEvents[i$jscomp$inline_1489],
-    domEventName$jscomp$inline_1491 =
-      eventName$jscomp$inline_1490.toLowerCase(),
-    capitalizedEvent$jscomp$inline_1492 =
-      eventName$jscomp$inline_1490[0].toUpperCase() +
-      eventName$jscomp$inline_1490.slice(1);
+  var eventName$jscomp$inline_1489 =
+      simpleEventPluginEvents[i$jscomp$inline_1488],
+    domEventName$jscomp$inline_1490 =
+      eventName$jscomp$inline_1489.toLowerCase(),
+    capitalizedEvent$jscomp$inline_1491 =
+      eventName$jscomp$inline_1489[0].toUpperCase() +
+      eventName$jscomp$inline_1489.slice(1);
   registerSimpleEvent(
-    domEventName$jscomp$inline_1491,
-    "on" + capitalizedEvent$jscomp$inline_1492
+    domEventName$jscomp$inline_1490,
+    "on" + capitalizedEvent$jscomp$inline_1491
   );
 }
 registerSimpleEvent(ANIMATION_END, "onAnimationEnd");
@@ -14265,15 +14270,16 @@ function isSuspenseInstanceFallback(instance) {
 }
 function registerSuspenseInstanceRetry(instance, callback) {
   var ownerDocument = instance.ownerDocument;
-  "complete" !== ownerDocument.readyState &&
-    ownerDocument.addEventListener(
-      "DOMContentLoaded",
-      function () {
-        "$?" === instance.data && callback();
-      },
-      { once: !0 }
-    );
-  instance._reactRetry = callback;
+  if ("$?" !== instance.data || "complete" === ownerDocument.readyState)
+    callback();
+  else {
+    var listener = function () {
+      callback();
+      ownerDocument.removeEventListener("DOMContentLoaded", listener);
+    };
+    ownerDocument.addEventListener("DOMContentLoaded", listener);
+    instance._reactRetry = listener;
+  }
 }
 function getNextHydratable(node) {
   for (; null != node; node = node.nextSibling) {
@@ -15856,16 +15862,16 @@ ReactDOMHydrationRoot.prototype.unstable_scheduleHydration = function (target) {
     0 === i && attemptExplicitHydrationTarget(target);
   }
 };
-var isomorphicReactPackageVersion$jscomp$inline_1732 = React.version;
+var isomorphicReactPackageVersion$jscomp$inline_1731 = React.version;
 if (
-  "19.0.0-native-fb-16d2bbbd-20241203" !==
-  isomorphicReactPackageVersion$jscomp$inline_1732
+  "19.0.0-native-fb-de68d2f4-20241204" !==
+  isomorphicReactPackageVersion$jscomp$inline_1731
 )
   throw Error(
     formatProdErrorMessage(
       527,
-      isomorphicReactPackageVersion$jscomp$inline_1732,
-      "19.0.0-native-fb-16d2bbbd-20241203"
+      isomorphicReactPackageVersion$jscomp$inline_1731,
+      "19.0.0-native-fb-de68d2f4-20241204"
     )
   );
 ReactDOMSharedInternals.findDOMNode = function (componentOrElement) {
@@ -15885,25 +15891,25 @@ ReactDOMSharedInternals.findDOMNode = function (componentOrElement) {
     null === componentOrElement ? null : componentOrElement.stateNode;
   return componentOrElement;
 };
-var internals$jscomp$inline_2187 = {
+var internals$jscomp$inline_2186 = {
   bundleType: 0,
-  version: "19.0.0-native-fb-16d2bbbd-20241203",
+  version: "19.0.0-native-fb-de68d2f4-20241204",
   rendererPackageName: "react-dom",
   currentDispatcherRef: ReactSharedInternals,
   findFiberByHostInstance: getClosestInstanceFromNode,
-  reconcilerVersion: "19.0.0-native-fb-16d2bbbd-20241203"
+  reconcilerVersion: "19.0.0-native-fb-de68d2f4-20241204"
 };
 if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
-  var hook$jscomp$inline_2188 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
+  var hook$jscomp$inline_2187 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
   if (
-    !hook$jscomp$inline_2188.isDisabled &&
-    hook$jscomp$inline_2188.supportsFiber
+    !hook$jscomp$inline_2187.isDisabled &&
+    hook$jscomp$inline_2187.supportsFiber
   )
     try {
-      (rendererID = hook$jscomp$inline_2188.inject(
-        internals$jscomp$inline_2187
+      (rendererID = hook$jscomp$inline_2187.inject(
+        internals$jscomp$inline_2186
       )),
-        (injectedHook = hook$jscomp$inline_2188);
+        (injectedHook = hook$jscomp$inline_2187);
     } catch (err) {}
 }
 exports.createRoot = function (container, options) {
@@ -15995,4 +16001,4 @@ exports.hydrateRoot = function (container, initialChildren, options) {
   listenToAllSupportedEvents(container);
   return new ReactDOMHydrationRoot(initialChildren);
 };
-exports.version = "19.0.0-native-fb-16d2bbbd-20241203";
+exports.version = "19.0.0-native-fb-de68d2f4-20241204";
diff --git a/...book-fbsource/xplat/js/RKJSModules/vendor/react/react-dom/cjs/ReactDOMClient-profiling.js b/...book-fbsource/xplat/js/RKJSModules/vendor/react/react-dom/cjs/ReactDOMClient-profiling.js
@@ -7,7 +7,7 @@
  * @noflow
  * @nolint
  * @preventMunge
- * @generated SignedSource<<0ebd78a0cf049a802a2b35960edaa452>>
+ * @generated SignedSource<<d41e5384bdb7ebba5c6944401702170a>>
  */
 
 /*
@@ -6828,13 +6828,8 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) {
       );
     } else
       "$?" === nextInstance.data
-        ? ((workInProgress.flags |= 128),
+        ? ((workInProgress.flags |= 192),
           (workInProgress.child = current.child),
-          (workInProgress = retryDehydratedSuspenseBoundary.bind(
-            null,
-            current
-          )),
-          registerSuspenseInstanceRetry(nextInstance, workInProgress),
           (workInProgress = null))
         : ((renderLanes = JSCompiler_temp$jscomp$0.treeContext),
           (nextHydratableInstance = getNextHydratable(
@@ -8933,6 +8928,16 @@ function commitLayoutEffectOnFiber(finishedRoot, current, finishedWork) {
     case 13:
       recursivelyTraverseLayoutEffects(finishedRoot, finishedWork);
       flags & 4 && commitSuspenseHydrationCallbacks(finishedRoot, finishedWork);
+      flags & 64 &&
+        ((finishedRoot = finishedWork.memoizedState),
+        null !== finishedRoot &&
+          ((finishedRoot = finishedRoot.dehydrated),
+          null !== finishedRoot &&
+            ((finishedWork = retryDehydratedSuspenseBoundary.bind(
+              null,
+              finishedWork
+            )),
+            registerSuspenseInstanceRetry(finishedRoot, finishedWork))));
       break;
     case 22:
       if (0 !== (finishedWork.mode & 1)) {
@@ -12997,20 +13002,20 @@ function extractEvents$1(
   }
 }
 for (
-  var i$jscomp$inline_1577 = 0;
-  i$jscomp$inline_1577 < simpleEventPluginEvents.length;
-  i$jscomp$inline_1577++
+  var i$jscomp$inline_1576 = 0;
+  i$jscomp$inline_1576 < simpleEventPluginEvents.length;
+  i$jscomp$inline_1576++
 ) {
-  var eventName$jscomp$inline_1578 =
-      simpleEventPluginEvents[i$jscomp$inline_1577],
-    domEventName$jscomp$inline_1579 =
-      eventName$jscomp$inline_1578.toLowerCase(),
-    capitalizedEvent$jscomp$inline_1580 =
-      eventName$jscomp$inline_1578[0].toUpperCase() +
-      eventName$jscomp$inline_1578.slice(1);
+  var eventName$jscomp$inline_1577 =
+      simpleEventPluginEvents[i$jscomp$inline_1576],
+    domEventName$jscomp$inline_1578 =
+      eventName$jscomp$inline_1577.toLowerCase(),
+    capitalizedEvent$jscomp$inline_1579 =
+      eventName$jscomp$inline_1577[0].toUpperCase() +
+      eventName$jscomp$inline_1577.slice(1);
   registerSimpleEvent(
-    domEventName$jscomp$inline_1579,
-    "on" + capitalizedEvent$jscomp$inline_1580
+    domEventName$jscomp$inline_1578,
+    "on" + capitalizedEvent$jscomp$inline_1579
   );
 }
 registerSimpleEvent(ANIMATION_END, "onAnimationEnd");
@@ -14910,15 +14915,16 @@ function isSuspenseInstanceFallback(instance) {
 }
 function registerSuspenseInstanceRetry(instance, callback) {
   var ownerDocument = instance.ownerDocument;
-  "complete" !== ownerDocument.readyState &&
-    ownerDocument.addEventListener(
-      "DOMContentLoaded",
-      function () {
-        "$?" === instance.data && callback();
-      },
-      { once: !0 }
-    );
-  instance._reactRetry = callback;
+  if ("$?" !== instance.data || "complete" === ownerDocument.readyState)
+    callback();
+  else {
+    var listener = function () {
+      callback();
+      ownerDocument.removeEventListener("DOMContentLoaded", listener);
+    };
+    ownerDocument.addEventListener("DOMContentLoaded", listener);
+    instance._reactRetry = listener;
+  }
 }
 function getNextHydratable(node) {
   for (; null != node; node = node.nextSibling) {
@@ -16509,16 +16515,16 @@ ReactDOMHydrationRoot.prototype.unstable_scheduleHydration = function (target) {
     0 === i && attemptExplicitHydrationTarget(target);
   }
 };
-var isomorphicReactPackageVersion$jscomp$inline_1822 = React.version;
+var isomorphicReactPackageVersion$jscomp$inline_1821 = React.version;
 if (
-  "19.0.0-native-fb-16d2bbbd-20241203" !==
-  isomorphicReactPackageVersion$jscomp$inline_1822
+  "19.0.0-native-fb-de68d2f4-20241204" !==
+  isomorphicReactPackageVersion$jscomp$inline_1821
 )
   throw Error(
     formatProdErrorMessage(
       527,
-      isomorphicReactPackageVersion$jscomp$inline_1822,
-      "19.0.0-native-fb-16d2bbbd-20241203"
+      isomorphicReactPackageVersion$jscomp$inline_1821,
+      "19.0.0-native-fb-de68d2f4-20241204"
     )
   );
 ReactDOMSharedInternals.findDOMNode = function (componentOrElement) {
@@ -16538,13 +16544,13 @@ ReactDOMSharedInternals.findDOMNode = function (componentOrElement) {
     null === componentOrElement ? null : componentOrElement.stateNode;
   return componentOrElement;
 };
-var internals$jscomp$inline_1829 = {
+var internals$jscomp$inline_1828 = {
   bundleType: 0,
-  version: "19.0.0-native-fb-16d2bbbd-20241203",
+  version: "19.0.0-native-fb-de68d2f4-20241204",
   rendererPackageName: "react-dom",
   currentDispatcherRef: ReactSharedInternals,
   findFiberByHostInstance: getClosestInstanceFromNode,
-  reconcilerVersion: "19.0.0-native-fb-16d2bbbd-20241203",
+  reconcilerVersion: "19.0.0-native-fb-de68d2f4-20241204",
   getLaneLabelMap: function () {
     for (
       var map = new Map(), lane = 1, index$292 = 0;
@@ -16562,16 +16568,16 @@ var internals$jscomp$inline_1829 = {
   }
 };
 if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
-  var hook$jscomp$inline_2239 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
+  var hook$jscomp$inline_2238 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
   if (
-    !hook$jscomp$inline_2239.isDisabled &&
-    hook$jscomp$inline_2239.supportsFiber
+    !hook$jscomp$inline_2238.isDisabled &&
+    hook$jscomp$inline_2238.supportsFiber
   )
     try {
-      (rendererID = hook$jscomp$inline_2239.inject(
-        internals$jscomp$inline_1829
+      (rendererID = hook$jscomp$inline_2238.inject(
+        internals$jscomp$inline_1828
       )),
-        (injectedHook = hook$jscomp$inline_2239);
+        (injectedHook = hook$jscomp$inline_2238);
     } catch (err) {}
 }
 exports.createRoot = function (container, options) {
@@ -16663,4 +16669,4 @@ exports.hydrateRoot = function (container, initialChildren, options) {
   listenToAllSupportedEvents(container);
   return new ReactDOMHydrationRoot(initialChildren);
 };
-exports.version = "19.0.0-native-fb-16d2bbbd-20241203";
+exports.version = "19.0.0-native-fb-de68d2f4-20241204";
Original file line number	Diff line number	Diff line change
		@@ -1 +1 @@
		19.0.0-native-fb-16d2bbbd-20241203
		19.0.0-native-fb-de68d2f4-20241204