hanzoai/react
2
0
Fork 0
mirror of https://github.com/hanzoai/react.git synced 2026-09-24 17:02:27 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix Logging of Immediately Resolved Promises (#31610)

Browse Source 
This avoid re-emitting the yellow "Event" log when we ping inside the
original event. Instead of treating events as repeated when we get
repeated updates, we treat them as repeated if we've ever logged out
this event before.

Additionally, in the case the prerender sibling flag is on we need to
ensure that if a render gets interrupted when it has been suspended we
treat that as "Prewarm" instead of "Interrupted Render".

Before:
<img width="539" alt="Screenshot 2024-11-19 at 2 39 44 PM"
src="https://github.com/user-attachments/assets/190ca50c-5168-40d8-a6fd-6b9a583af1f0">

After:

<img width="1004" alt="Screenshot 2024-11-21 at 4 53 16 PM"
src="https://github.com/user-attachments/assets/0c441ada-1ed1-412c-8935-aaf040c25dfe">
This commit is contained in:
Sebastian Markbåge
2024-11-21 17:16:54 -05:00
committed by GitHub
parent 117c675008
commit 0a7eeb5ba0
2 changed files with 33 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/react-reconciler/src/ReactFiberWorkLoop.js
Vendored
+13 -4
View File
@@ -265,7 +265,6 @@ import {
startProfilerTimer,
stopProfilerTimerIfRunningAndRecordDuration,
stopProfilerTimerIfRunningAndRecordIncompleteDuration,
markUpdateAsRepeat,
trackSuspendedTime,
startYieldTimer,
yieldStartTime,
@@ -927,6 +926,7 @@ export function performWorkOnRoot(
// We've returned from yielding to the event loop. Let's log the time it took.
const yieldEndTime = now();
switch (yieldReason) {
case SuspendedOnImmediate:
case SuspendedOnData:
logSuspendedYieldTime(yieldStartTime, yieldEndTime, yieldedFiber);
break;
@@ -1009,7 +1009,6 @@ export function performWorkOnRoot(
setCurrentTrackFromLanes(lanes);
logInconsistentRender(renderStartTime, renderEndTime);
finalizeRender(lanes, renderEndTime);
markUpdateAsRepeat(lanes);
}
// A store was mutated in an interleaved event. Render again,
// synchronously, to block further mutations.
@@ -1036,7 +1035,6 @@ export function performWorkOnRoot(
setCurrentTrackFromLanes(lanes);
logErroredRenderPhase(renderStartTime, renderEndTime);
finalizeRender(lanes, renderEndTime);
markUpdateAsRepeat(lanes);
}
lanes = errorRetryLanes;
exitStatus = recoverFromConcurrentError(
@@ -1740,7 +1738,18 @@ function prepareFreshStack(root: FiberRoot, lanes: Lanes): Fiber {
previousRenderStartTime > 0
) {
setCurrentTrackFromLanes(workInProgressRootRenderLanes);
logInterruptedRenderPhase(previousRenderStartTime, renderStartTime);
if (
workInProgressRootExitStatus === RootSuspended ||
workInProgressRootExitStatus === RootSuspendedWithDelay
) {
// If the root was already suspended when it got interrupted and restarted,
// then this is considered a prewarm and not an interrupted render because
// we couldn't have shown anything anyway so it's not a bad thing that we
// got interrupted.
logSuspendedRenderPhase(previousRenderStartTime, renderStartTime);
} else {
logInterruptedRenderPhase(previousRenderStartTime, renderStartTime);
}
finalizeRender(workInProgressRootRenderLanes, renderStartTime);
}
packages/react-reconciler/src/ReactProfilerTimer.js
Vendored
+20 -22
View File
@@ -80,9 +80,12 @@ export function startUpdateTimerByLane(lane: Lane): void {
blockingUpdateTime = now();
const newEventTime = resolveEventTimeStamp();
const newEventType = resolveEventType();
blockingEventIsRepeat =
newEventTime === blockingEventTime &&
newEventType === blockingEventType;
if (
newEventTime !== blockingEventTime ||
newEventType !== blockingEventType
) {
blockingEventIsRepeat = false;
}
blockingEventTime = newEventTime;
blockingEventType = newEventType;
}
@@ -92,9 +95,12 @@ export function startUpdateTimerByLane(lane: Lane): void {
if (transitionStartTime < 0) {
const newEventTime = resolveEventTimeStamp();
const newEventType = resolveEventType();
transitionEventIsRepeat =
newEventTime === transitionEventTime &&
newEventType === transitionEventType;
if (
newEventTime !== transitionEventTime ||
newEventType !== transitionEventType
) {
transitionEventIsRepeat = false;
}
transitionEventTime = newEventTime;
transitionEventType = newEventType;
}
@@ -102,19 +108,6 @@ export function startUpdateTimerByLane(lane: Lane): void {
}
}
export function markUpdateAsRepeat(lanes: Lanes): void {
if (!enableProfilerTimer || !enableComponentPerformanceTrack) {
return;
}
// We're about to do a retry of this render. It is not a new update, so treat this
// as a repeat within the same event.
if (includesSyncLane(lanes) || includesBlockingLane(lanes)) {
blockingEventIsRepeat = true;
} else if (includesTransitionLane(lanes)) {
transitionEventIsRepeat = true;
}
}
export function trackSuspendedTime(lanes: Lanes, renderEndTime: number) {
if (!enableProfilerTimer || !enableComponentPerformanceTrack) {
return;
@@ -129,6 +122,7 @@ export function trackSuspendedTime(lanes: Lanes, renderEndTime: number) {
export function clearBlockingTimers(): void {
blockingUpdateTime = -1.1;
blockingSuspendedTime = -1.1;
blockingEventIsRepeat = true;
}
export function startAsyncTransitionTimer(): void {
@@ -139,9 +133,12 @@ export function startAsyncTransitionTimer(): void {
transitionStartTime = now();
const newEventTime = resolveEventTimeStamp();
const newEventType = resolveEventType();
transitionEventIsRepeat =
newEventTime === transitionEventTime &&
newEventType === transitionEventType;
if (
newEventTime !== transitionEventTime ||
newEventType !== transitionEventType
) {
transitionEventIsRepeat = false;
}
transitionEventTime = newEventTime;
transitionEventType = newEventType;
}
@@ -173,6 +170,7 @@ export function clearTransitionTimers(): void {
transitionStartTime = -1.1;
transitionUpdateTime = -1.1;
transitionSuspendedTime = -1.1;
transitionEventIsRepeat = true;
}
export function clampBlockingTimers(finalTime: number): void {