Skip to content

Commit b225d4f

Browse files
authored
Revert "Revert "Refactor commitPlacement to recursively insert nodes (#17996)" (#18517)" (#18540)
This reverts commit e69ca31.
1 parent 241103a commit b225d4f

File tree

1 file changed

+61
-33
lines changed

1 file changed

+61
-33
lines changed

packages/react-reconciler/src/ReactFiberCommitWork.js

Lines changed: 61 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -1279,44 +1279,72 @@ function commitPlacement(finishedWork: Fiber): void {
12791279
const before = getHostSibling(finishedWork);
12801280
// We only have the top Fiber that was inserted but we need to recurse down its
12811281
// children to find all the terminal nodes.
1282-
let node: Fiber = finishedWork;
1283-
while (true) {
1284-
const isHost = node.tag === HostComponent || node.tag === HostText;
1285-
if (isHost || (enableFundamentalAPI && node.tag === FundamentalComponent)) {
1286-
const stateNode = isHost ? node.stateNode : node.stateNode.instance;
1287-
if (before) {
1288-
if (isContainer) {
1289-
insertInContainerBefore(parent, stateNode, before);
1290-
} else {
1291-
insertBefore(parent, stateNode, before);
1292-
}
1293-
} else {
1294-
if (isContainer) {
1295-
appendChildToContainer(parent, stateNode);
1296-
} else {
1297-
appendChild(parent, stateNode);
1298-
}
1282+
if (isContainer) {
1283+
insertOrAppendPlacementNodeIntoContainer(finishedWork, before, parent);
1284+
} else {
1285+
insertOrAppendPlacementNode(finishedWork, before, parent);
1286+
}
1287+
}
1288+
1289+
function insertOrAppendPlacementNodeIntoContainer(
1290+
node: Fiber,
1291+
before: ?Instance,
1292+
parent: Container,
1293+
): void {
1294+
const {tag} = node;
1295+
const isHost = tag === HostComponent || tag === HostText;
1296+
if (isHost || (enableFundamentalAPI && tag === FundamentalComponent)) {
1297+
const stateNode = isHost ? node.stateNode : node.stateNode.instance;
1298+
if (before) {
1299+
insertInContainerBefore(parent, stateNode, before);
1300+
} else {
1301+
appendChildToContainer(parent, stateNode);
1302+
}
1303+
} else if (tag === HostPortal) {
1304+
// If the insertion itself is a portal, then we don't want to traverse
1305+
// down its children. Instead, we'll get insertions from each child in
1306+
// the portal directly.
1307+
} else {
1308+
const child = node.child;
1309+
if (child !== null) {
1310+
insertOrAppendPlacementNodeIntoContainer(child, before, parent);
1311+
let sibling = child.sibling;
1312+
while (sibling !== null) {
1313+
insertOrAppendPlacementNodeIntoContainer(sibling, before, parent);
1314+
sibling = sibling.sibling;
12991315
}
1300-
} else if (node.tag === HostPortal) {
1301-
// If the insertion itself is a portal, then we don't want to traverse
1302-
// down its children. Instead, we'll get insertions from each child in
1303-
// the portal directly.
1304-
} else if (node.child !== null) {
1305-
node.child.return = node;
1306-
node = node.child;
1307-
continue;
13081316
}
1309-
if (node === finishedWork) {
1310-
return;
1317+
}
1318+
}
1319+
1320+
function insertOrAppendPlacementNode(
1321+
node: Fiber,
1322+
before: ?Instance,
1323+
parent: Instance,
1324+
): void {
1325+
const {tag} = node;
1326+
const isHost = tag === HostComponent || tag === HostText;
1327+
if (isHost || (enableFundamentalAPI && tag === FundamentalComponent)) {
1328+
const stateNode = isHost ? node.stateNode : node.stateNode.instance;
1329+
if (before) {
1330+
insertBefore(parent, stateNode, before);
1331+
} else {
1332+
appendChild(parent, stateNode);
13111333
}
1312-
while (node.sibling === null) {
1313-
if (node.return === null || node.return === finishedWork) {
1314-
return;
1334+
} else if (tag === HostPortal) {
1335+
// If the insertion itself is a portal, then we don't want to traverse
1336+
// down its children. Instead, we'll get insertions from each child in
1337+
// the portal directly.
1338+
} else {
1339+
const child = node.child;
1340+
if (child !== null) {
1341+
insertOrAppendPlacementNode(child, before, parent);
1342+
let sibling = child.sibling;
1343+
while (sibling !== null) {
1344+
insertOrAppendPlacementNode(sibling, before, parent);
1345+
sibling = sibling.sibling;
13151346
}
1316-
node = node.return;
13171347
}
1318-
node.sibling.return = node.return;
1319-
node = node.sibling;
13201348
}
13211349
}
13221350

0 commit comments

Comments
 (0)