Skip to content

Commit

Permalink
refactor[react-devtools/fiber/renderer]: optimize durations resolution
Browse files Browse the repository at this point in the history
  • Loading branch information
hoxyq committed Oct 4, 2024
1 parent 6845e0b commit 830e823
Show file tree
Hide file tree
Showing 2 changed files with 28 additions and 5 deletions.
24 changes: 19 additions & 5 deletions packages/react-devtools-shared/src/backend/fiber/renderer.js
Original file line number Diff line number Diff line change
Expand Up @@ -44,6 +44,7 @@ import {
} from 'react-devtools-shared/src/utils';
import {
formatConsoleArgumentsToSingleString,
formatDurationToMicrosecondsGranularity,
gt,
gte,
parseSourceFromComponentStack,
Expand Down Expand Up @@ -5074,20 +5075,33 @@ export function attach(
const fiberSelfDurations: Array<[number, number]> = [];
for (let i = 0; i < durations.length; i += 3) {
const fiberID = durations[i];
fiberActualDurations.push([fiberID, durations[i + 1]]);
fiberSelfDurations.push([fiberID, durations[i + 2]]);
fiberActualDurations.push([
fiberID,
formatDurationToMicrosecondsGranularity(durations[i + 1]),
]);
fiberSelfDurations.push([
fiberID,
formatDurationToMicrosecondsGranularity(durations[i + 2]),
]);
}

commitData.push({
changeDescriptions:
changeDescriptions !== null
? Array.from(changeDescriptions.entries())
: null,
duration: maxActualDuration,
effectDuration,
duration:
formatDurationToMicrosecondsGranularity(maxActualDuration),
effectDuration:
effectDuration !== null
? formatDurationToMicrosecondsGranularity(effectDuration)
: null,
fiberActualDurations,
fiberSelfDurations,
passiveEffectDuration,
passiveEffectDuration:
passiveEffectDuration !== null
? formatDurationToMicrosecondsGranularity(passiveEffectDuration)
: null,
priorityLevel,
timestamp: commitTime,
updaters,
Expand Down
9 changes: 9 additions & 0 deletions packages/react-devtools-shared/src/backend/utils/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -331,3 +331,12 @@ export function parseSourceFromComponentStack(

return parseSourceFromFirefoxStack(componentStack);
}

// 0.123456789 => 0.123
// Expects high-resolution timestamp in milliseconds, like from performance.now()
// Mainly used for optimizing the size of serialized profiling payload
export function formatDurationToMicrosecondsGranularity(
duration: number,
): number {
return Math.round(duration * 1000) / 1000;
}

0 comments on commit 830e823

Please sign in to comment.