Revert "Offscreen: Use JS stack to track hidden/unhidden subtree state" (#21194)

This reverts commit 1f8583d.

Author: Brian Vaughn

packages/react-reconciler/src/ReactFiberCommitWork.new.js

@@ -156,7 +156,9 @@ if (__DEV__) {
 // Allows us to avoid traversing the return path to find the nearest Offscreen ancestor.
 // Only used when enableSuspenseLayoutEffectSemantics is enabled.
 let offscreenSubtreeIsHidden: boolean = false;
+const offscreenSubtreeIsHiddenStack: Array<boolean> = [];
 let offscreenSubtreeWasHidden: boolean = false;
+const offscreenSubtreeWasHiddenStack: Array<boolean> = [];
 
 const PossiblyWeakSet = typeof WeakSet === 'function' ? WeakSet : Set;
 
@@ -2303,35 +2305,11 @@ function commitLayoutEffects_begin(
         const wasHidden = current !== null && current.memoizedState !== null;
         const isHidden = fiber.memoizedState !== null;
 
-        const newOffscreenSubtreeIsHidden =
-          isHidden || offscreenSubtreeIsHidden;
-        const newOffscreenSubtreeWasHidden =
-          wasHidden || offscreenSubtreeWasHidden;
+        offscreenSubtreeWasHidden = wasHidden || offscreenSubtreeWasHidden;
+        offscreenSubtreeIsHidden = isHidden || offscreenSubtreeIsHidden;
 
-        if (
-          newOffscreenSubtreeIsHidden !== offscreenSubtreeIsHidden ||
-          newOffscreenSubtreeWasHidden !== offscreenSubtreeWasHidden
-        ) {
-          const prevOffscreenSubtreeIsHidden = offscreenSubtreeIsHidden;
-          const prevOffscreenSubtreeWasHidden = offscreenSubtreeWasHidden;
-
-          nextEffect = fiber;
-          offscreenSubtreeIsHidden = newOffscreenSubtreeIsHidden;
-          offscreenSubtreeWasHidden = newOffscreenSubtreeWasHidden;
-
-          // Traverse the Offscreen subtree with the current Offscreen as the root.
-          commitLayoutEffects_begin(
-            fiber, // New root; bubble back up to here and stop.
-            root,
-            committedLanes,
-          );
-
-          nextEffect = fiber.sibling;
-          offscreenSubtreeIsHidden = prevOffscreenSubtreeIsHidden;
-          offscreenSubtreeWasHidden = prevOffscreenSubtreeWasHidden;
-
-          continue;
-        }
+        offscreenSubtreeWasHiddenStack.push(wasHidden);
+        offscreenSubtreeIsHiddenStack.push(isHidden);
       }
     }
 
@@ -2372,6 +2350,23 @@ function commitLayoutMountEffects_complete(
   while (nextEffect !== null) {
     const fiber = nextEffect;
 
+    if (enableSuspenseLayoutEffectSemantics && isModernRoot) {
+      if (fiber.tag === OffscreenComponent) {
+        offscreenSubtreeWasHiddenStack.pop();
+        offscreenSubtreeIsHiddenStack.pop();
+        offscreenSubtreeWasHidden =
+          offscreenSubtreeWasHiddenStack.length > 0 &&
+          offscreenSubtreeWasHiddenStack[
+            offscreenSubtreeWasHiddenStack.length - 1
+          ];
+        offscreenSubtreeIsHidden =
+          offscreenSubtreeIsHiddenStack.length > 0 &&
+          offscreenSubtreeIsHiddenStack[
+            offscreenSubtreeIsHiddenStack.length - 1
+          ];
+      }
+    }
+
     if (
       enableSuspenseLayoutEffectSemantics &&
       isModernRoot &&

packages/react-reconciler/src/ReactFiberCommitWork.old.js

@@ -156,7 +156,9 @@ if (__DEV__) {
 // Allows us to avoid traversing the return path to find the nearest Offscreen ancestor.
 // Only used when enableSuspenseLayoutEffectSemantics is enabled.
 let offscreenSubtreeIsHidden: boolean = false;
+const offscreenSubtreeIsHiddenStack: Array<boolean> = [];
 let offscreenSubtreeWasHidden: boolean = false;
+const offscreenSubtreeWasHiddenStack: Array<boolean> = [];
 
 const PossiblyWeakSet = typeof WeakSet === 'function' ? WeakSet : Set;
 
@@ -2303,35 +2305,11 @@ function commitLayoutEffects_begin(
         const wasHidden = current !== null && current.memoizedState !== null;
         const isHidden = fiber.memoizedState !== null;
 
-        const newOffscreenSubtreeIsHidden =
-          isHidden || offscreenSubtreeIsHidden;
-        const newOffscreenSubtreeWasHidden =
-          wasHidden || offscreenSubtreeWasHidden;
+        offscreenSubtreeWasHidden = wasHidden || offscreenSubtreeWasHidden;
+        offscreenSubtreeIsHidden = isHidden || offscreenSubtreeIsHidden;
 
-        if (
-          newOffscreenSubtreeIsHidden !== offscreenSubtreeIsHidden ||
-          newOffscreenSubtreeWasHidden !== offscreenSubtreeWasHidden
-        ) {
-          const prevOffscreenSubtreeIsHidden = offscreenSubtreeIsHidden;
-          const prevOffscreenSubtreeWasHidden = offscreenSubtreeWasHidden;
-
-          nextEffect = fiber;
-          offscreenSubtreeIsHidden = newOffscreenSubtreeIsHidden;
-          offscreenSubtreeWasHidden = newOffscreenSubtreeWasHidden;
-
-          // Traverse the Offscreen subtree with the current Offscreen as the root.
-          commitLayoutEffects_begin(
-            fiber, // New root; bubble back up to here and stop.
-            root,
-            committedLanes,
-          );
-
-          nextEffect = fiber.sibling;
-          offscreenSubtreeIsHidden = prevOffscreenSubtreeIsHidden;
-          offscreenSubtreeWasHidden = prevOffscreenSubtreeWasHidden;
-
-          continue;
-        }
+        offscreenSubtreeWasHiddenStack.push(wasHidden);
+        offscreenSubtreeIsHiddenStack.push(isHidden);
       }
     }
 
@@ -2372,6 +2350,23 @@ function commitLayoutMountEffects_complete(
   while (nextEffect !== null) {
     const fiber = nextEffect;
 
+    if (enableSuspenseLayoutEffectSemantics && isModernRoot) {
+      if (fiber.tag === OffscreenComponent) {
+        offscreenSubtreeWasHiddenStack.pop();
+        offscreenSubtreeIsHiddenStack.pop();
+        offscreenSubtreeWasHidden =
+          offscreenSubtreeWasHiddenStack.length > 0 &&
+          offscreenSubtreeWasHiddenStack[
+            offscreenSubtreeWasHiddenStack.length - 1
+          ];
+        offscreenSubtreeIsHidden =
+          offscreenSubtreeIsHiddenStack.length > 0 &&
+          offscreenSubtreeIsHiddenStack[
+            offscreenSubtreeIsHiddenStack.length - 1
+          ];
+      }
+    }
+
     if (
       enableSuspenseLayoutEffectSemantics &&
       isModernRoot &&