bvaughn/react-devtools-experimental

Component filtering breaks Profiler timing calculations

Closed this issue · 2 comments

The Profiler UI excludes child durations from components to show a more meaningful view of the data:

export const calculateSelfDuration = (
id: number,
commitTree: CommitTreeFrontend,
commitDetails: CommitDetailsFrontend
): number => {
const { actualDurations } = commitDetails;
const { nodes } = commitTree;
if (!actualDurations.has(id)) {
return 0;
}
const node = nodes.get(id);
if (node == null) {
throw Error(`Could not find node with id "${id}" in commit tree`);
}
let selfDuration = actualDurations.get(id) || 0;
node.children.forEach(childID => {
if (actualDurations.has(childID)) {
selfDuration -= actualDurations.get(childID) || 0;
}
});
return selfDuration;
};

This doesn't really work if components have been filtered out in between. It may end up attributing more time to the parent than was actually spent by that component.

In general, this is an interesting question- since Profiling a filtered tree may give you a pretty incomplete sense of the data. I'm not sure what the best thing is to do here. Would be interested in discussing it at some point.

For now though, maybe we should move this calculation into the renderer (backend) so that it can be more resilient to filter settings.

I fixed the main problem this issue describes in cf99c3e but there are still a couple of interesting things we might want to consider:

  • The "self duration" reported against a Suspense node is misleading, because it potentially includes time spent working in the component that suspended.
  • The Profiler view is a bit misleading when there are filtered nodes, because there will be a delta between the sum of all visible "self durations" and the actual durations.

I guess I'll close this and consider it done for now but we may want to follow up on those other two things.