OSSForks/react
1
0
Fork 0
mirror of https://github.com/zebrajr/react.git synced 2026-01-15 12:15:22 +00:00
Code Issues Actions 6 Packages Projects Releases Wiki Activity

[DevTools] Compute new reordered child set from the instance tree (#30668)

Browse Source 
This is already filtered and simply just all the ids in the linked list.

Same principle as #30665.
This commit is contained in:
Sebastian Markbåge
2024-08-13 15:18:34 -04:00
committed by GitHub
parent e865fe0722
commit 082a690cc3
1 changed files with 16 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files

69
packages/react-devtools-shared/src/backend/fiber/renderer.js vendored
View File

@@ -2516,24 +2516,28 @@ export function attach(
}
}
function recordResetChildren(
parentInstance: DevToolsInstance,
childSet: Fiber,
) {
function recordResetChildren(parentInstance: DevToolsInstance) {
if (__DEBUG__) {
debug('recordResetChildren()', childSet, parentInstance);
if (
parentInstance.firstChild !== null &&
parentInstance.firstChild.kind === FIBER_INSTANCE
) {
debug(
'recordResetChildren()',
parentInstance.firstChild.data,
parentInstance,
);
}
}
// The frontend only really cares about the displayName, key, and children.
// The first two don't really change, so we are only concerned with the order of children here.
// This is trickier than a simple comparison though, since certain types of fibers are filtered.
const nextChildren: Array<number> = [];
// This is a naive implementation that shallowly recourses children.
// We might want to revisit this if it proves to be too inefficient.
let child: null | Fiber = childSet;
let child: null | DevToolsInstance = parentInstance.firstChild;
while (child !== null) {
findReorderedChildrenRecursively(child, nextChildren);
child = child.sibling;
nextChildren.push(child.id);
child = child.nextSibling;
}
const numChildren = nextChildren.length;
@@ -2549,38 +2553,6 @@ export function attach(
}
}
function findReorderedChildrenRecursively(
fiber: Fiber,
nextChildren: Array<number>,
) {
if (!shouldFilterFiber(fiber)) {
nextChildren.push(getFiberIDThrows(fiber));
} else {
let child = fiber.child;
const isTimedOutSuspense =
fiber.tag === SuspenseComponent && fiber.memoizedState !== null;
if (isTimedOutSuspense) {
// Special case: if Suspense mounts in a timed-out state,
// get the fallback child from the inner fragment,
// and skip over the primary child.
const primaryChildFragment = fiber.child;
const fallbackChildFragment = primaryChildFragment
? primaryChildFragment.sibling
: null;
const fallbackChild = fallbackChildFragment
? fallbackChildFragment.child
: null;
if (fallbackChild !== null) {
child = fallbackChild;
}
}
while (child !== null) {
findReorderedChildrenRecursively(child, nextChildren);
child = child.sibling;
}
}
}
// Returns whether closest unfiltered fiber parent needs to reset its child list.
function updateChildrenRecursively(
nextFirstChild: null | Fiber,
@@ -2865,17 +2837,8 @@ export function attach(
// We need to crawl the subtree for closest non-filtered Fibers
// so that we can display them in a flat children set.
if (shouldIncludeInTree) {
// Normally, search for children from the rendered child.
let nextChildSet = nextFiber.child;
if (nextDidTimeOut) {
// Special case: timed-out Suspense renders the fallback set.
const nextFiberChild = nextFiber.child;
nextChildSet = nextFiberChild ? nextFiberChild.sibling : null;
}
if (nextChildSet != null) {
if (reconcilingParent !== null) {
recordResetChildren(reconcilingParent, nextChildSet);
}
if (reconcilingParent !== null) {
recordResetChildren(reconcilingParent);
}
// We've handled the child order change for this Fiber.
// Since it's included, there's no need to invalidate parent child order.