From 779a472b0901b2d28e382f3850b2ad09a555b014 Mon Sep 17 00:00:00 2001
From: Andrew Clark <git@andrewclark.io>
Date: Tue, 27 Oct 2020 14:51:34 -0500
Subject: [PATCH] Prevent inlining into recursive commit functions (#20105)

Adds a bunch of no-inline directives to commit phase functions to
prevent them from being inlined into one of our recursive algorithms.

The motivation is to minimize the number of variables in the recursive
functions, since each one contributes to the size of the stack frame.

Theoretically, this could help the performance of both the recursive
and non-recursive (iterative) implementations of the commit phase,
since even the iterative implementation sometimes uses the JS stack.
---
 .../src/ReactFiberCommitWork.new.js                 | 13 +++++++++++++
 1 file changed, 13 insertions(+)

diff --git a/packages/react-reconciler/src/ReactFiberCommitWork.new.js b/packages/react-reconciler/src/ReactFiberCommitWork.new.js
index 2997e809a4996..699b0ac45ae9b 100644
--- a/packages/react-reconciler/src/ReactFiberCommitWork.new.js
+++ b/packages/react-reconciler/src/ReactFiberCommitWork.new.js
@@ -212,6 +212,7 @@ function safelyCallComponentWillUnmount(
   }
 }
 
+/** @noinline */
 function safelyDetachRef(current: Fiber, nearestMountedAncestor: Fiber) {
   const ref = current.ref;
   if (ref !== null) {
@@ -279,6 +280,7 @@ export function safelyCallDestroy(
   }
 }
 
+/** @noinline */
 function commitHookEffectListUnmount(
   flags: HookFlags,
   finishedWork: Fiber,
@@ -303,6 +305,7 @@ function commitHookEffectListUnmount(
   }
 }
 
+/** @noinline */
 function commitHookEffectListMount(flags: HookFlags, finishedWork: Fiber) {
   const updateQueue: FunctionComponentUpdateQueue | null = (finishedWork.updateQueue: any);
   const lastEffect = updateQueue !== null ? updateQueue.lastEffect : null;
@@ -512,6 +515,7 @@ function iterativelyCommitBeforeMutationEffects_complete() {
   }
 }
 
+/** @noinline */
 function commitBeforeMutationEffectsOnFiber(finishedWork: Fiber) {
   const current = finishedWork.alternate;
   const flags = finishedWork.flags;
@@ -627,6 +631,7 @@ function commitBeforeMutationEffectsOnFiber(finishedWork: Fiber) {
   }
 }
 
+/** @noinline */
 function commitBeforeMutationEffectsDeletions(deletions: Array<Fiber>) {
   for (let i = 0; i < deletions.length; i++) {
     const fiber = deletions[i];
@@ -778,6 +783,7 @@ function iterativelyCommitMutationEffects_complete(
   }
 }
 
+/** @noinline */
 function commitMutationEffectsOnFiber(
   fiber: Fiber,
   root: FiberRoot,
@@ -848,6 +854,7 @@ function commitMutationEffectsOnFiber(
   }
 }
 
+/** @noinline */
 function commitMutationEffectsDeletions(
   deletions: Array<Fiber>,
   nearestMountedAncestor: Fiber,
@@ -1342,6 +1349,7 @@ function commitLayoutEffectsOnFiber(
   }
 }
 
+/** @noinline */
 function commitLayoutEffectsForProfiler(
   finishedWork: Fiber,
   finishedRoot: FiberRoot,
@@ -1407,6 +1415,7 @@ function commitLayoutEffectsForProfiler(
   }
 }
 
+/** @noinline */
 function commitLayoutEffectsForClassComponent(finishedWork: Fiber) {
   const instance = finishedWork.stateNode;
   const current = finishedWork.alternate;
@@ -1555,6 +1564,7 @@ function commitLayoutEffectsForClassComponent(finishedWork: Fiber) {
   }
 }
 
+/** @noinline */
 function commitLayoutEffectsForHostRoot(finishedWork: Fiber) {
   // TODO: I think this is now always non-null by the time it reaches the
   // commit phase. Consider removing the type check.
@@ -1575,6 +1585,7 @@ function commitLayoutEffectsForHostRoot(finishedWork: Fiber) {
   }
 }
 
+/** @noinline */
 function commitLayoutEffectsForHostComponent(finishedWork: Fiber) {
   const instance: Instance = finishedWork.stateNode;
   const current = finishedWork.alternate;
@@ -1590,6 +1601,7 @@ function commitLayoutEffectsForHostComponent(finishedWork: Fiber) {
   }
 }
 
+/** @noinline */
 function hideOrUnhideAllChildren(finishedWork, isHidden) {
   if (supportsMutation) {
     // We only have the top Fiber that was inserted but we need to recurse down its
@@ -2950,6 +2962,7 @@ function commitSuspenseComponent(finishedWork: Fiber) {
   }
 }
 
+/** @noinline */
 function commitSuspenseHydrationCallbacks(
   finishedRoot: FiberRoot,
   finishedWork: Fiber,