Skip to content

Commit

Permalink
Remove idToTreeBaseDurationMap and idToRootMap maps
Browse files Browse the repository at this point in the history 
Cloning the Map isn't really all that super fast anyway and it means we
have to maintain the map continuously as we render.

Instead, we can track it on the instances and then walk the instances
to create a snapshot when starting to profile. This isn't as fast but
really fast too and requires less bookkeeping while rendering.
  • Loading branch information
@sebmarkbage
sebmarkbage committed Aug 26, 2024
1 parent b65c514 commit 3e2119c
Showing 1 changed file with 36 additions and 55 deletions.
91 changes: 36 additions & 55 deletions packages/react-devtools-shared/src/backend/fiber/renderer.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -155,6 +155,7 @@ type FiberInstance = {
componentStack: null | string,
errors: null | Map<string, number>, // error messages and count
warnings: null | Map<string, number>, // warning messages and count
treeBaseDuration: number, // the profiled time of the last render of this subtree
data: Fiber, // one of a Fiber pair
};

Expand All @@ -170,6 +171,7 @@ function createFiberInstance(fiber: Fiber): FiberInstance {
componentStack: null,
errors: null,
warnings: null,
treeBaseDuration: 0,
data: fiber,
};
}
Expand All @@ -193,6 +195,7 @@ type VirtualInstance = {
// that old errors/warnings don't disappear when the instance is refreshed.
errors: null | Map<string, number>, // error messages and count
warnings: null | Map<string, number>, // warning messages and count
treeBaseDuration: number, // the profiled time of the last render of this subtree
// The latest info for this instance. This can be updated over time and the
// same info can appear in more than once ServerComponentInstance.
data: ReactComponentInfo,
Expand All @@ -212,6 +215,7 @@ function createVirtualInstance(
componentStack: null,
errors: null,
warnings: null,
treeBaseDuration: 0,
data: debugEntry,
};
}
Expand Down Expand Up @@ -1346,16 +1350,6 @@ export function attach(
}
}

// When profiling is supported, we store the latest tree base durations for each Fiber.
// This is so that we can quickly capture a snapshot of those values if profiling starts.
// If we didn't store these values, we'd have to crawl the tree when profiling started,
// and use a slow path to find each of the current Fibers.
const idToTreeBaseDurationMap: Map<number, number> = new Map();

// When profiling is supported, we store the latest tree base durations for each Fiber.
// This map enables us to filter these times by root when sending them to the frontend.
const idToRootMap: Map<number, number> = new Map();

// When a mount or update is in progress, this value tracks the root that is being operated on.
let currentRootID: number = -1;

Expand Down Expand Up @@ -2192,8 +2186,6 @@ export function attach(
}

if (isProfilingSupported) {
idToRootMap.set(id, currentRootID);

recordProfilingDurations(fiberInstance);
}
return fiberInstance;
Expand All @@ -2207,8 +2199,6 @@ export function attach(

idToDevToolsInstanceMap.set(id, instance);

const isProfilingSupported = false; // TODO: Support Tree Base Duration Based on Children.

const componentInfo = instance.data;

const key =
Expand Down Expand Up @@ -2245,10 +2235,6 @@ export function attach(
pushOperation(ownerID);
pushOperation(displayNameStringID);
pushOperation(keyStringID);

if (isProfilingSupported) {
idToRootMap.set(id, currentRootID);
}
}

function recordUnmount(fiberInstance: FiberInstance): void {
Expand Down Expand Up @@ -2283,12 +2269,6 @@ export function attach(
}

untrackFiber(fiberInstance);

const isProfilingSupported = fiber.hasOwnProperty('treeBaseDuration');
if (isProfilingSupported) {
idToRootMap.delete(id);
idToTreeBaseDurationMap.delete(id);
}
}

// Running state of the remaining children from the previous version of this parent that
Expand Down Expand Up @@ -2416,12 +2396,6 @@ export function attach(

const id = instance.id;
pendingRealUnmountedIDs.push(id);

const isProfilingSupported = false; // TODO: Profiling support.
if (isProfilingSupported) {
idToRootMap.delete(id);
idToTreeBaseDurationMap.delete(id);
}
}

function mountVirtualChildrenRecursively(
Expand Down Expand Up @@ -2660,7 +2634,7 @@ export function attach(
const fiber = fiberInstance.data;
const {actualDuration, treeBaseDuration} = fiber;

idToTreeBaseDurationMap.set(id, treeBaseDuration || 0);
fiberInstance.treeBaseDuration = treeBaseDuration || 0;

if (isProfiling) {
const {alternate} = fiber;
Expand Down Expand Up @@ -2735,14 +2709,11 @@ export function attach(
child !== null;
child = child.nextSibling
) {
const childDuration = idToTreeBaseDurationMap.get(child.id);
if (childDuration !== undefined) {
treeBaseDuration += childDuration;
}
treeBaseDuration += child.treeBaseDuration;
}

if (isProfiling) {
const previousTreeBaseDuration = idToTreeBaseDurationMap.get(id);
const previousTreeBaseDuration = virtualInstance.treeBaseDuration;
if (treeBaseDuration !== previousTreeBaseDuration) {
// Tree base duration updates are included in the operations typed array.
// So we have to convert them from milliseconds to microseconds so we can send them as ints.
Expand All @@ -2755,7 +2726,7 @@ export function attach(
}
}

idToTreeBaseDurationMap.set(id, treeBaseDuration || 0);
virtualInstance.treeBaseDuration = treeBaseDuration;
}

function recordResetChildren(parentInstance: DevToolsInstance) {
Expand Down Expand Up @@ -5132,8 +5103,8 @@ export function attach(
let currentCommitProfilingMetadata: CommitProfilingData | null = null;
let displayNamesByRootID: DisplayNamesByRootID | null = null;
let idToContextsMap: Map<number, any> | null = null;
let initialTreeBaseDurationsMap: Map<number, number> | null = null;
let initialIDToRootMap: Map<number, number> | null = null;
let initialTreeBaseDurationsMap: Map<number, Array<[number, number]>> | null =
null;
let isProfiling: boolean = false;
let profilingStartTime: number = 0;
let recordChangeDescriptions: boolean = false;
Expand All @@ -5152,24 +5123,15 @@ export function attach(
rootToCommitProfilingMetadataMap.forEach(
(commitProfilingMetadata, rootID) => {
const commitData: Array<CommitDataBackend> = [];
const initialTreeBaseDurations: Array<[number, number]> = [];

const displayName =
(displayNamesByRootID !== null && displayNamesByRootID.get(rootID)) ||
'Unknown';

if (initialTreeBaseDurationsMap != null) {
initialTreeBaseDurationsMap.forEach((treeBaseDuration, id) => {
if (
initialIDToRootMap != null &&
initialIDToRootMap.get(id) === rootID
) {
// We don't need to convert milliseconds to microseconds in this case,
// because the profiling summary is JSON serialized.
initialTreeBaseDurations.push([id, treeBaseDuration]);
}
});
}
const initialTreeBaseDurations: Array<[number, number]> =
(initialTreeBaseDurationsMap !== null &&
initialTreeBaseDurationsMap.get(rootID)) ||
[];

commitProfilingMetadata.forEach((commitProfilingData, commitIndex) => {
const {
Expand Down Expand Up @@ -5256,6 +5218,22 @@ export function attach(
};
}

function snapshotTreeBaseDurations(
instance: DevToolsInstance,
target: Array<[number, number]>,
) {
// We don't need to convert milliseconds to microseconds in this case,
// because the profiling summary is JSON serialized.
target.push([instance.id, instance.treeBaseDuration]);
for (
let child = instance.firstChild;
child !== null;
child = child.nextSibling
) {
snapshotTreeBaseDurations(child, target);
}
}

function startProfiling(shouldRecordChangeDescriptions: boolean) {
if (isProfiling) {
return;
Expand All @@ -5268,16 +5246,19 @@ export function attach(
// since either of these may change during the profiling session
// (e.g. when a fiber is re-rendered or when a fiber gets removed).
displayNamesByRootID = new Map();
initialTreeBaseDurationsMap = new Map(idToTreeBaseDurationMap);
initialIDToRootMap = new Map(idToRootMap);
initialTreeBaseDurationsMap = new Map();
idToContextsMap = new Map();

hook.getFiberRoots(rendererID).forEach(root => {
const rootID = getFiberIDThrows(root.current);
const rootInstance = getFiberInstanceThrows(root.current);
const rootID = rootInstance.id;
((displayNamesByRootID: any): DisplayNamesByRootID).set(
rootID,
getDisplayNameForRoot(root.current),
);
const initialTreeBaseDurations: Array<[number, number]> = [];
snapshotTreeBaseDurations(rootInstance, initialTreeBaseDurations);
(initialTreeBaseDurationsMap: any).set(rootID, initialTreeBaseDurations);

if (shouldRecordChangeDescriptions) {
// Record all contexts at the time profiling is started.
Expand Down

0 comments on commit 3e2119c

Please sign in to comment.