Fix Overlapping "message" Bug in Performance Track (#31528)

When you schedule a microtask from render or effect and then call
setState (or ping) from there, the "event" is the event that React
scheduled (which will be a postMessage). The event time of this new
render will be before the last render finished.
We usually clamp these but in this scenario the update doesn't happen
while a render is happening. Causing overlapping events.
Before:
<img width="1229" alt="Screenshot 2024-11-12 at 11 01 30 PM"
src="https://github.com/user-attachments/assets/9652cf3b-b358-453c-b295-1239cbb15952">
Therefore when we finalize a render we need to store the end of the last
render so when we a new update comes in later with an event time earlier
than that, we know to clamp it.
There's also a special case here where when we enter the
`RootDidNotComplete` or `RootSuspendedWithDelay` case we neither leave
the root as in progress nor commit it. Those needs to finalize too.
Really this should be modeled as a suspended track that we haven't added
yet. That's the gap between "Blocked" and "message" below.
After:
<img width="1471" alt="Screenshot 2024-11-13 at 12 31 34 AM"
src="https://github.com/user-attachments/assets/b24f994e-9055-4b10-ad29-ad9b36302ffc">
I also fixed an issue where we may log the same event name multiple
times if we're rendering more than once in the same event. In this case
I just leave a blank trace between the last commit and the next update.
I also adding ignoring of the "message" event at all in these cases when
the event is from React's scheduling itself.

Author: sebmarkbage

packages/react-art/src/ReactFiberConfigART.js

@@ -363,6 +363,8 @@ export function resolveUpdatePriority(): EventPriority {
 returncurrentUpdatePriority||DefaultEventPriority;
 }
 
+exportfunctiontrackSchedulerEvent(): void{}
+
 export functionresolveEventType(): null|string{
 returnnull;
 }

packages/react-dom-bindings/src/client/ReactFiberConfigDOM.js

@@ -606,14 +606,19 @@ export function shouldAttemptEagerTransition(): boolean {
 returnfalse;
 }
 
+letschedulerEvent: void|Event=undefined;
+exportfunctiontrackSchedulerEvent(): void{
+schedulerEvent=window.event;
+}
+
 export functionresolveEventType(): null|string{
 constevent=window.event;
-returnevent ? event.type : null;
+returnevent&&event!==schedulerEvent? event.type : null;
 }
 
 exportfunctionresolveEventTimeStamp(): number{
 constevent=window.event;
-returnevent ? event.timeStamp : -1.1;
+returnevent&&event!==schedulerEvent? event.timeStamp : -1.1;
 }
 
 exportconstisPrimaryRenderer=true;

packages/react-native-renderer/src/ReactFiberConfigFabric.js

@@ -372,6 +372,8 @@ export function resolveUpdatePriority(): EventPriority {
 returnDefaultEventPriority;
 }
 
+exportfunctiontrackSchedulerEvent(): void{}
+
 export functionresolveEventType(): null|string{
 returnnull;
 }

packages/react-native-renderer/src/ReactFiberConfigNative.js

@@ -288,6 +288,8 @@ export function resolveUpdatePriority(): EventPriority {
 returnDefaultEventPriority;
 }
 
+exportfunctiontrackSchedulerEvent(): void{}
+
 export functionresolveEventType(): null|string{
 returnnull;
 }

packages/react-noop-renderer/src/createReactNoop.js

@@ -531,6 +531,8 @@ function createReactNoop(reconciler: Function, useMutation: boolean) {
 returncurrentEventPriority;
 },
 
+trackSchedulerEvent(): void{},
+
 resolveEventType(): null|string{
  return null;
 },

packages/react-reconciler/src/ReactFiberPerformanceTrack.js

@@ -118,6 +118,7 @@ export function logBlockingStart(
 updateTime: number,
 eventTime: number,
 eventType: null|string,
+eventIsRepeat: boolean,
 renderStartTime: number,
 ): void{
 if(supportsUserTiming){
@@ -127,7 +128,7 @@ export function logBlockingStart(
 reusableLaneDevToolDetails.color='secondary-dark';
 reusableLaneOptions.start=eventTime;
 reusableLaneOptions.end=updateTime>0 ? updateTime : renderStartTime;
-performance.measure(eventType,reusableLaneOptions);
+performance.measure(eventIsRepeat ? '' : eventType,reusableLaneOptions);
 }
 if(updateTime>0){
 // Log the time from when we called setState until we started rendering.
@@ -144,6 +145,7 @@ export function logTransitionStart(
 updateTime: number,
 eventTime: number,
 eventType: null|string,
+eventIsRepeat: boolean,
 renderStartTime: number,
 ): void{
 if(supportsUserTiming){
@@ -158,7 +160,7 @@ export function logTransitionStart(
  : updateTime>0
  ? updateTime
  : renderStartTime;
-performance.measure(eventType,reusableLaneOptions);
+performance.measure(eventIsRepeat ? '' : eventType,reusableLaneOptions);
 }
 if(startTime>0){
 // Log the time from when we started an async transition until we called setState or started rendering.

packages/react-reconciler/src/ReactFiberRootScheduler.js

@@ -18,6 +18,7 @@ import {
 disableSchedulerTimeoutInWorkLoop,
 enableProfilerTimer,
 enableProfilerNestedUpdatePhase,
+enableComponentPerformanceTrack,
 enableSiblingPrerendering,
 }from'shared/ReactFeatureFlags';
 import{
@@ -64,6 +65,7 @@ import {
 supportsMicrotasks,
 scheduleMicrotask,
 shouldAttemptEagerTransition,
+trackSchedulerEvent,
 }from'./ReactFiberConfig';
 
 importReactSharedInternalsfrom'shared/ReactSharedInternals';
@@ -225,6 +227,12 @@ function flushSyncWorkAcrossRoots_impl(
 }
 
 functionprocessRootScheduleInMicrotask(){
+if(enableProfilerTimer&&enableComponentPerformanceTrack){
+// Track the currently executing event if there is one so we can ignore this
+// event when logging events.
+trackSchedulerEvent();
+}
+
 // This function is always called inside a microtask. It should never be
 // called synchronously.
 didScheduleMicrotask=false;
@@ -428,6 +436,12 @@ function performWorkOnRootViaSchedulerTask(
 resetNestedUpdateFlag();
 }
 
+if(enableProfilerTimer&&enableComponentPerformanceTrack){
+// Track the currently executing event if there is one so we can ignore this
+// event when logging events.
+trackSchedulerEvent();
+}
+
 // Flush any pending passive effects before deciding which lanes to work on,
 // in case they schedule additional work.
 constoriginalCallbackNode=root.callbackNode;

packages/react-reconciler/src/ReactFiberWorkLoop.js

@@ -90,6 +90,7 @@ import {
 setCurrentUpdatePriority,
 getCurrentUpdatePriority,
 resolveUpdatePriority,
+trackSchedulerEvent,
 }from'./ReactFiberConfig';
 
 import{createWorkInProgress,resetWorkInProgress}from'./ReactFiber';
@@ -229,13 +230,17 @@ import {
 }from'./ReactFiberConcurrentUpdates';
 
 import{
+blockingClampTime,
 blockingUpdateTime,
 blockingEventTime,
 blockingEventType,
+blockingEventIsRepeat,
+transitionClampTime,
 transitionStartTime,
 transitionUpdateTime,
 transitionEventTime,
 transitionEventType,
+transitionEventIsRepeat,
 clearBlockingTimers,
 clearTransitionTimers,
 clampBlockingTimers,
@@ -938,6 +943,9 @@ export function performWorkOnRoot(
 }
 break;
 }elseif(exitStatus===RootDidNotComplete){
+if(enableProfilerTimer&&enableComponentPerformanceTrack){
+finalizeRender(lanes,now());
+}
 // The render unwound without completing the tree. This happens in special
 // cases where need to exit the current render without producing a
 // consistent tree or committing.
@@ -1130,6 +1138,9 @@ function finishConcurrentRender(
 // This is a transition, so we should exit without committing a
 // placeholder and without scheduling a timeout. Delay indefinitely
 // until we receive more data.
+if(enableProfilerTimer&&enableComponentPerformanceTrack){
+finalizeRender(lanes,now());
+}
 constdidAttemptEntireTree=
 !workInProgressRootDidSkipSuspendedSiblings;
 markRootSuspended(
@@ -1655,19 +1666,31 @@ function prepareFreshStack(root: FiberRoot, lanes: Lanes): Fiber {
 
 if(includesSyncLane(lanes)||includesBlockingLane(lanes)){
 logBlockingStart(
-blockingUpdateTime,
-blockingEventTime,
+blockingUpdateTime>=0&&blockingUpdateTime<blockingClampTime
+ ? blockingClampTime
+ : blockingUpdateTime,
+blockingEventTime>=0&&blockingEventTime<blockingClampTime
+ ? blockingClampTime
+ : blockingEventTime,
 blockingEventType,
+blockingEventIsRepeat,
 renderStartTime,
 );
 clearBlockingTimers();
 }
 if(includesTransitionLane(lanes)){
 logTransitionStart(
-transitionStartTime,
-transitionUpdateTime,
-transitionEventTime,
+transitionStartTime>=0&&transitionStartTime<transitionClampTime
+ ? transitionClampTime
+ : transitionStartTime,
+transitionUpdateTime>=0&&transitionUpdateTime<transitionClampTime
+ ? transitionClampTime
+ : transitionUpdateTime,
+transitionEventTime>=0&&transitionEventTime<transitionClampTime
+ ? transitionClampTime
+ : transitionEventTime,
 transitionEventType,
+transitionEventIsRepeat,
 renderStartTime,
 );
 clearTransitionTimers();
@@ -3139,6 +3162,11 @@ function commitRootImpl(
 // with setTimeout
 pendingPassiveTransitions=transitions;
 scheduleCallback(NormalSchedulerPriority,()=>{
+if(enableProfilerTimer&&enableComponentPerformanceTrack){
+// Track the currently executing event if there is one so we can ignore this
+// event when logging events.
+trackSchedulerEvent();
+}
 flushPassiveEffects(true);
 // This render triggered passive effects: release the root cache pool
 // *after* passive effects fire to avoid freeing a cache pool that may

packages/react-reconciler/src/ReactProfilerTimer.js

@@ -36,14 +36,18 @@ export let componentEffectDuration: number = -0;
 exportletcomponentEffectStartTime: number=-1.1;
 exportletcomponentEffectEndTime: number=-1.1;
 
+exportletblockingClampTime: number=-0;
 exportletblockingUpdateTime: number=-1.1;// First sync setState scheduled.
 exportletblockingEventTime: number=-1.1;// Event timeStamp of the first setState.
 export letblockingEventType: null|string=null;// Event type of the first setState.
+exportletblockingEventIsRepeat: boolean=false;
 // TODO: This should really be one per Transition lane.
+exportlettransitionClampTime: number=-0;
 exportlettransitionStartTime: number=-1.1;// First startTransition call before setState.
 exportlettransitionUpdateTime: number=-1.1;// First transition setState scheduled.
 exportlettransitionEventTime: number=-1.1;// Event timeStamp of the first transition.
 export lettransitionEventType: null|string=null;// Event type of the first transition.
+exportlettransitionEventIsRepeat: boolean=false;
 
 exportfunctionstartUpdateTimerByLane(lane: Lane): void{
 if(!enableProfilerTimer||!enableComponentPerformanceTrack){
@@ -52,15 +56,25 @@ export function startUpdateTimerByLane(lane: Lane): void {
 if(isSyncLane(lane)||isBlockingLane(lane)){
 if(blockingUpdateTime<0){
 blockingUpdateTime=now();
-blockingEventTime=resolveEventTimeStamp();
-blockingEventType=resolveEventType();
+constnewEventTime=resolveEventTimeStamp();
+constnewEventType=resolveEventType();
+blockingEventIsRepeat=
+newEventTime===blockingEventTime&&
+newEventType===blockingEventType;
+blockingEventTime=newEventTime;
+blockingEventType=newEventType;
 }
 }elseif(isTransitionLane(lane)){
 if(transitionUpdateTime<0){
 transitionUpdateTime=now();
 if(transitionStartTime<0){
-transitionEventTime=resolveEventTimeStamp();
-transitionEventType=resolveEventType();
+constnewEventTime=resolveEventTimeStamp();
+constnewEventType=resolveEventType();
+transitionEventIsRepeat=
+newEventTime===transitionEventTime&&
+newEventType===transitionEventType;
+transitionEventTime=newEventTime;
+transitionEventType=newEventType;
 }
 }
 }
@@ -76,8 +90,13 @@ export function startAsyncTransitionTimer(): void {
 }
 if(transitionStartTime<0&&transitionUpdateTime<0){
 transitionStartTime=now();
-transitionEventTime=resolveEventTimeStamp();
-transitionEventType=resolveEventType();
+constnewEventTime=resolveEventTimeStamp();
+constnewEventType=resolveEventType();
+transitionEventIsRepeat=
+newEventTime===transitionEventTime&&
+newEventType===transitionEventType;
+transitionEventTime=newEventTime;
+transitionEventType=newEventType;
 }
 }
 
@@ -115,12 +134,7 @@ export function clampBlockingTimers(finalTime: number): void {
 // If we had new updates come in while we were still rendering or committing, we don't want
 // those update times to create overlapping tracks in the performance timeline so we clamp
 // them to the end of the commit phase.
-if(blockingUpdateTime>=0&&blockingUpdateTime<finalTime){
-blockingUpdateTime=finalTime;
-}
-if(blockingEventTime>=0&&blockingEventTime<finalTime){
-blockingEventTime=finalTime;
-}
+blockingClampTime=finalTime;
 }
 
 exportfunctionclampTransitionTimers(finalTime: number): void{
@@ -130,15 +144,7 @@ export function clampTransitionTimers(finalTime: number): void {
 // If we had new updates come in while we were still rendering or committing, we don't want
 // those update times to create overlapping tracks in the performance timeline so we clamp
 // them to the end of the commit phase.
-if(transitionStartTime>=0&&transitionStartTime<finalTime){
-transitionStartTime=finalTime;
-}
-if(transitionUpdateTime>=0&&transitionUpdateTime<finalTime){
-transitionUpdateTime=finalTime;
-}
-if(transitionEventTime>=0&&transitionEventTime<finalTime){
-transitionEventTime=finalTime;
-}
+transitionClampTime=finalTime;
 }
 
 exportfunctionpushNestedEffectDurations(): number{

packages/react-reconciler/src/__tests__/ReactFiberHostContext-test.internal.js

@@ -83,6 +83,7 @@ describe('ReactFiberHostContext', () => {
 }
 returnDefaultEventPriority;
 },
+trackSchedulerEvent: function(){},
 resolveEventType: function(){
 returnnull;
 },

packages/react-art/src/ReactFiberConfigART.js

@@ -363,6 +363,8 @@ export function resolveUpdatePriority(): EventPriority {
 returncurrentUpdatePriority||DefaultEventPriority;
 }
 
+exportfunctiontrackSchedulerEvent(): void{}
+
 export functionresolveEventType(): null|string{
 returnnull;
 }

packages/react-dom-bindings/src/client/ReactFiberConfigDOM.js

@@ -606,14 +606,19 @@ export function shouldAttemptEagerTransition(): boolean {
 returnfalse;
 }
 
+letschedulerEvent: void|Event=undefined;
+exportfunctiontrackSchedulerEvent(): void{
+schedulerEvent=window.event;
+}
+
 export functionresolveEventType(): null|string{
 constevent=window.event;
-returnevent ? event.type : null;
+returnevent&&event!==schedulerEvent? event.type : null;
 }
 
 exportfunctionresolveEventTimeStamp(): number{
 constevent=window.event;
-returnevent ? event.timeStamp : -1.1;
+returnevent&&event!==schedulerEvent? event.timeStamp : -1.1;
 }
 
 exportconstisPrimaryRenderer=true;

packages/react-native-renderer/src/ReactFiberConfigFabric.js

@@ -372,6 +372,8 @@ export function resolveUpdatePriority(): EventPriority {
 returnDefaultEventPriority;
 }
 
+exportfunctiontrackSchedulerEvent(): void{}
+
 export functionresolveEventType(): null|string{
 returnnull;
 }

packages/react-native-renderer/src/ReactFiberConfigNative.js

@@ -288,6 +288,8 @@ export function resolveUpdatePriority(): EventPriority {
 returnDefaultEventPriority;
 }
 
+exportfunctiontrackSchedulerEvent(): void{}
+
 export functionresolveEventType(): null|string{
 returnnull;
 }

packages/react-noop-renderer/src/createReactNoop.js

@@ -531,6 +531,8 @@ function createReactNoop(reconciler: Function, useMutation: boolean) {
 returncurrentEventPriority;
 },
 
+trackSchedulerEvent(): void{},
+
 resolveEventType(): null|string{
  return null;
 },

packages/react-reconciler/src/ReactFiberPerformanceTrack.js

@@ -118,6 +118,7 @@ export function logBlockingStart(
 updateTime: number,
 eventTime: number,
 eventType: null|string,
+eventIsRepeat: boolean,
 renderStartTime: number,
 ): void{
 if(supportsUserTiming){
@@ -127,7 +128,7 @@ export function logBlockingStart(
 reusableLaneDevToolDetails.color='secondary-dark';
 reusableLaneOptions.start=eventTime;
 reusableLaneOptions.end=updateTime>0 ? updateTime : renderStartTime;
-performance.measure(eventType,reusableLaneOptions);
+performance.measure(eventIsRepeat ? '' : eventType,reusableLaneOptions);
 }
 if(updateTime>0){
 // Log the time from when we called setState until we started rendering.
@@ -144,6 +145,7 @@ export function logTransitionStart(
 updateTime: number,
 eventTime: number,
 eventType: null|string,
+eventIsRepeat: boolean,
 renderStartTime: number,
 ): void{
 if(supportsUserTiming){
@@ -158,7 +160,7 @@ export function logTransitionStart(
  : updateTime>0
  ? updateTime
  : renderStartTime;
-performance.measure(eventType,reusableLaneOptions);
+performance.measure(eventIsRepeat ? '' : eventType,reusableLaneOptions);
 }
 if(startTime>0){
 // Log the time from when we started an async transition until we called setState or started rendering.

packages/react-reconciler/src/ReactFiberRootScheduler.js

@@ -18,6 +18,7 @@ import {
 disableSchedulerTimeoutInWorkLoop,
 enableProfilerTimer,
 enableProfilerNestedUpdatePhase,
+enableComponentPerformanceTrack,
 enableSiblingPrerendering,
 }from'shared/ReactFeatureFlags';
 import{
@@ -64,6 +65,7 @@ import {
 supportsMicrotasks,
 scheduleMicrotask,
 shouldAttemptEagerTransition,
+trackSchedulerEvent,
 }from'./ReactFiberConfig';
 
 importReactSharedInternalsfrom'shared/ReactSharedInternals';
@@ -225,6 +227,12 @@ function flushSyncWorkAcrossRoots_impl(
 }
 
 functionprocessRootScheduleInMicrotask(){
+if(enableProfilerTimer&&enableComponentPerformanceTrack){
+// Track the currently executing event if there is one so we can ignore this
+// event when logging events.
+trackSchedulerEvent();
+}
+
 // This function is always called inside a microtask. It should never be
 // called synchronously.
 didScheduleMicrotask=false;
@@ -428,6 +436,12 @@ function performWorkOnRootViaSchedulerTask(
 resetNestedUpdateFlag();
 }
 
+if(enableProfilerTimer&&enableComponentPerformanceTrack){
+// Track the currently executing event if there is one so we can ignore this
+// event when logging events.
+trackSchedulerEvent();
+}
+
 // Flush any pending passive effects before deciding which lanes to work on,
 // in case they schedule additional work.
 constoriginalCallbackNode=root.callbackNode;

packages/react-reconciler/src/ReactFiberWorkLoop.js

@@ -90,6 +90,7 @@ import {
 setCurrentUpdatePriority,
 getCurrentUpdatePriority,
 resolveUpdatePriority,
+trackSchedulerEvent,
 }from'./ReactFiberConfig';
 
 import{createWorkInProgress,resetWorkInProgress}from'./ReactFiber';
@@ -229,13 +230,17 @@ import {
 }from'./ReactFiberConcurrentUpdates';
 
 import{
+blockingClampTime,
 blockingUpdateTime,
 blockingEventTime,
 blockingEventType,
+blockingEventIsRepeat,
+transitionClampTime,
 transitionStartTime,
 transitionUpdateTime,
 transitionEventTime,
 transitionEventType,
+transitionEventIsRepeat,
 clearBlockingTimers,
 clearTransitionTimers,
 clampBlockingTimers,
@@ -938,6 +943,9 @@ export function performWorkOnRoot(
 }
 break;
 }elseif(exitStatus===RootDidNotComplete){
+if(enableProfilerTimer&&enableComponentPerformanceTrack){
+finalizeRender(lanes,now());
+}
 // The render unwound without completing the tree. This happens in special
 // cases where need to exit the current render without producing a
 // consistent tree or committing.
@@ -1130,6 +1138,9 @@ function finishConcurrentRender(
 // This is a transition, so we should exit without committing a
 // placeholder and without scheduling a timeout. Delay indefinitely
 // until we receive more data.
+if(enableProfilerTimer&&enableComponentPerformanceTrack){
+finalizeRender(lanes,now());
+}
 constdidAttemptEntireTree=
 !workInProgressRootDidSkipSuspendedSiblings;
 markRootSuspended(
@@ -1655,19 +1666,31 @@ function prepareFreshStack(root: FiberRoot, lanes: Lanes): Fiber {
 
 if(includesSyncLane(lanes)||includesBlockingLane(lanes)){
 logBlockingStart(
-blockingUpdateTime,
-blockingEventTime,
+blockingUpdateTime>=0&&blockingUpdateTime<blockingClampTime
+ ? blockingClampTime
+ : blockingUpdateTime,
+blockingEventTime>=0&&blockingEventTime<blockingClampTime
+ ? blockingClampTime
+ : blockingEventTime,
 blockingEventType,
+blockingEventIsRepeat,
 renderStartTime,
 );
 clearBlockingTimers();
 }
 if(includesTransitionLane(lanes)){
 logTransitionStart(
-transitionStartTime,
-transitionUpdateTime,
-transitionEventTime,
+transitionStartTime>=0&&transitionStartTime<transitionClampTime
+ ? transitionClampTime
+ : transitionStartTime,
+transitionUpdateTime>=0&&transitionUpdateTime<transitionClampTime
+ ? transitionClampTime
+ : transitionUpdateTime,
+transitionEventTime>=0&&transitionEventTime<transitionClampTime
+ ? transitionClampTime
+ : transitionEventTime,
 transitionEventType,
+transitionEventIsRepeat,
 renderStartTime,
 );
 clearTransitionTimers();
@@ -3139,6 +3162,11 @@ function commitRootImpl(
 // with setTimeout
 pendingPassiveTransitions=transitions;
 scheduleCallback(NormalSchedulerPriority,()=>{
+if(enableProfilerTimer&&enableComponentPerformanceTrack){
+// Track the currently executing event if there is one so we can ignore this
+// event when logging events.
+trackSchedulerEvent();
+}
 flushPassiveEffects(true);
 // This render triggered passive effects: release the root cache pool
 // *after* passive effects fire to avoid freeing a cache pool that may

packages/react-reconciler/src/ReactProfilerTimer.js

@@ -36,14 +36,18 @@ export let componentEffectDuration: number = -0;
 exportletcomponentEffectStartTime: number=-1.1;
 exportletcomponentEffectEndTime: number=-1.1;
 
+exportletblockingClampTime: number=-0;
 exportletblockingUpdateTime: number=-1.1;// First sync setState scheduled.
 exportletblockingEventTime: number=-1.1;// Event timeStamp of the first setState.
 export letblockingEventType: null|string=null;// Event type of the first setState.
+exportletblockingEventIsRepeat: boolean=false;
 // TODO: This should really be one per Transition lane.
+exportlettransitionClampTime: number=-0;
 exportlettransitionStartTime: number=-1.1;// First startTransition call before setState.
 exportlettransitionUpdateTime: number=-1.1;// First transition setState scheduled.
 exportlettransitionEventTime: number=-1.1;// Event timeStamp of the first transition.
 export lettransitionEventType: null|string=null;// Event type of the first transition.
+exportlettransitionEventIsRepeat: boolean=false;
 
 exportfunctionstartUpdateTimerByLane(lane: Lane): void{
 if(!enableProfilerTimer||!enableComponentPerformanceTrack){
@@ -52,15 +56,25 @@ export function startUpdateTimerByLane(lane: Lane): void {
 if(isSyncLane(lane)||isBlockingLane(lane)){
 if(blockingUpdateTime<0){
 blockingUpdateTime=now();
-blockingEventTime=resolveEventTimeStamp();
-blockingEventType=resolveEventType();
+constnewEventTime=resolveEventTimeStamp();
+constnewEventType=resolveEventType();
+blockingEventIsRepeat=
+newEventTime===blockingEventTime&&
+newEventType===blockingEventType;
+blockingEventTime=newEventTime;
+blockingEventType=newEventType;
 }
 }elseif(isTransitionLane(lane)){
 if(transitionUpdateTime<0){
 transitionUpdateTime=now();
 if(transitionStartTime<0){
-transitionEventTime=resolveEventTimeStamp();
-transitionEventType=resolveEventType();
+constnewEventTime=resolveEventTimeStamp();
+constnewEventType=resolveEventType();
+transitionEventIsRepeat=
+newEventTime===transitionEventTime&&
+newEventType===transitionEventType;
+transitionEventTime=newEventTime;
+transitionEventType=newEventType;
 }
 }
 }
@@ -76,8 +90,13 @@ export function startAsyncTransitionTimer(): void {
 }
 if(transitionStartTime<0&&transitionUpdateTime<0){
 transitionStartTime=now();
-transitionEventTime=resolveEventTimeStamp();
-transitionEventType=resolveEventType();
+constnewEventTime=resolveEventTimeStamp();
+constnewEventType=resolveEventType();
+transitionEventIsRepeat=
+newEventTime===transitionEventTime&&
+newEventType===transitionEventType;
+transitionEventTime=newEventTime;
+transitionEventType=newEventType;
 }
 }
 
@@ -115,12 +134,7 @@ export function clampBlockingTimers(finalTime: number): void {
 // If we had new updates come in while we were still rendering or committing, we don't want
 // those update times to create overlapping tracks in the performance timeline so we clamp
 // them to the end of the commit phase.
-if(blockingUpdateTime>=0&&blockingUpdateTime<finalTime){
-blockingUpdateTime=finalTime;
-}
-if(blockingEventTime>=0&&blockingEventTime<finalTime){
-blockingEventTime=finalTime;
-}
+blockingClampTime=finalTime;
 }
 
 exportfunctionclampTransitionTimers(finalTime: number): void{
@@ -130,15 +144,7 @@ export function clampTransitionTimers(finalTime: number): void {
 // If we had new updates come in while we were still rendering or committing, we don't want
 // those update times to create overlapping tracks in the performance timeline so we clamp
 // them to the end of the commit phase.
-if(transitionStartTime>=0&&transitionStartTime<finalTime){
-transitionStartTime=finalTime;
-}
-if(transitionUpdateTime>=0&&transitionUpdateTime<finalTime){
-transitionUpdateTime=finalTime;
-}
-if(transitionEventTime>=0&&transitionEventTime<finalTime){
-transitionEventTime=finalTime;
-}
+transitionClampTime=finalTime;
 }
 
 exportfunctionpushNestedEffectDurations(): number{

packages/react-reconciler/src/__tests__/ReactFiberHostContext-test.internal.js

@@ -83,6 +83,7 @@ describe('ReactFiberHostContext', () => {
 }
 returnDefaultEventPriority;
 },
+trackSchedulerEvent: function(){},
 resolveEventType: function(){
 returnnull;
 },

packages/react-art/src/ReactFiberConfigART.js

@@ -363,6 +363,8 @@ export function resolveUpdatePriority(): EventPriority {
 returncurrentUpdatePriority||DefaultEventPriority;
 }
 
+exportfunctiontrackSchedulerEvent(): void{}
+
 export functionresolveEventType(): null|string{
 returnnull;
 }

packages/react-dom-bindings/src/client/ReactFiberConfigDOM.js

@@ -606,14 +606,19 @@ export function shouldAttemptEagerTransition(): boolean {
 returnfalse;
 }
 
+letschedulerEvent: void|Event=undefined;
+exportfunctiontrackSchedulerEvent(): void{
+schedulerEvent=window.event;
+}
+
 export functionresolveEventType(): null|string{
 constevent=window.event;
-returnevent ? event.type : null;
+returnevent&&event!==schedulerEvent? event.type : null;
 }
 
 exportfunctionresolveEventTimeStamp(): number{
 constevent=window.event;
-returnevent ? event.timeStamp : -1.1;
+returnevent&&event!==schedulerEvent? event.timeStamp : -1.1;
 }
 
 exportconstisPrimaryRenderer=true;

packages/react-native-renderer/src/ReactFiberConfigFabric.js

@@ -372,6 +372,8 @@ export function resolveUpdatePriority(): EventPriority {
 returnDefaultEventPriority;
 }
 
+exportfunctiontrackSchedulerEvent(): void{}
+
 export functionresolveEventType(): null|string{
 returnnull;
 }

packages/react-native-renderer/src/ReactFiberConfigNative.js

@@ -288,6 +288,8 @@ export function resolveUpdatePriority(): EventPriority {
 returnDefaultEventPriority;
 }
 
+exportfunctiontrackSchedulerEvent(): void{}
+
 export functionresolveEventType(): null|string{
 returnnull;
 }

packages/react-noop-renderer/src/createReactNoop.js

@@ -531,6 +531,8 @@ function createReactNoop(reconciler: Function, useMutation: boolean) {
 returncurrentEventPriority;
 },
 
+trackSchedulerEvent(): void{},
+
 resolveEventType(): null|string{
  return null;
 },

packages/react-reconciler/src/ReactFiberPerformanceTrack.js

@@ -118,6 +118,7 @@ export function logBlockingStart(
 updateTime: number,
 eventTime: number,
 eventType: null|string,
+eventIsRepeat: boolean,
 renderStartTime: number,
 ): void{
 if(supportsUserTiming){
@@ -127,7 +128,7 @@ export function logBlockingStart(
 reusableLaneDevToolDetails.color='secondary-dark';
 reusableLaneOptions.start=eventTime;
 reusableLaneOptions.end=updateTime>0 ? updateTime : renderStartTime;
-performance.measure(eventType,reusableLaneOptions);
+performance.measure(eventIsRepeat ? '' : eventType,reusableLaneOptions);
 }
 if(updateTime>0){
 // Log the time from when we called setState until we started rendering.
@@ -144,6 +145,7 @@ export function logTransitionStart(
 updateTime: number,
 eventTime: number,
 eventType: null|string,
+eventIsRepeat: boolean,
 renderStartTime: number,
 ): void{
 if(supportsUserTiming){
@@ -158,7 +160,7 @@ export function logTransitionStart(
  : updateTime>0
  ? updateTime
  : renderStartTime;
-performance.measure(eventType,reusableLaneOptions);
+performance.measure(eventIsRepeat ? '' : eventType,reusableLaneOptions);
 }
 if(startTime>0){
 // Log the time from when we started an async transition until we called setState or started rendering.

packages/react-reconciler/src/ReactFiberRootScheduler.js

@@ -18,6 +18,7 @@ import {
 disableSchedulerTimeoutInWorkLoop,
 enableProfilerTimer,
 enableProfilerNestedUpdatePhase,
+enableComponentPerformanceTrack,
 enableSiblingPrerendering,
 }from'shared/ReactFeatureFlags';
 import{
@@ -64,6 +65,7 @@ import {
 supportsMicrotasks,
 scheduleMicrotask,
 shouldAttemptEagerTransition,
+trackSchedulerEvent,
 }from'./ReactFiberConfig';
 
 importReactSharedInternalsfrom'shared/ReactSharedInternals';
@@ -225,6 +227,12 @@ function flushSyncWorkAcrossRoots_impl(
 }
 
 functionprocessRootScheduleInMicrotask(){
+if(enableProfilerTimer&&enableComponentPerformanceTrack){
+// Track the currently executing event if there is one so we can ignore this
+// event when logging events.
+trackSchedulerEvent();
+}
+
 // This function is always called inside a microtask. It should never be
 // called synchronously.
 didScheduleMicrotask=false;
@@ -428,6 +436,12 @@ function performWorkOnRootViaSchedulerTask(
 resetNestedUpdateFlag();
 }
 
+if(enableProfilerTimer&&enableComponentPerformanceTrack){
+// Track the currently executing event if there is one so we can ignore this
+// event when logging events.
+trackSchedulerEvent();
+}
+
 // Flush any pending passive effects before deciding which lanes to work on,
 // in case they schedule additional work.
 constoriginalCallbackNode=root.callbackNode;

packages/react-reconciler/src/ReactFiberWorkLoop.js

@@ -90,6 +90,7 @@ import {
 setCurrentUpdatePriority,
 getCurrentUpdatePriority,
 resolveUpdatePriority,
+trackSchedulerEvent,
 }from'./ReactFiberConfig';
 
 import{createWorkInProgress,resetWorkInProgress}from'./ReactFiber';
@@ -229,13 +230,17 @@ import {
 }from'./ReactFiberConcurrentUpdates';
 
 import{
+blockingClampTime,
 blockingUpdateTime,
 blockingEventTime,
 blockingEventType,
+blockingEventIsRepeat,
+transitionClampTime,
 transitionStartTime,
 transitionUpdateTime,
 transitionEventTime,
 transitionEventType,
+transitionEventIsRepeat,
 clearBlockingTimers,
 clearTransitionTimers,
 clampBlockingTimers,
@@ -938,6 +943,9 @@ export function performWorkOnRoot(
 }
 break;
 }elseif(exitStatus===RootDidNotComplete){
+if(enableProfilerTimer&&enableComponentPerformanceTrack){
+finalizeRender(lanes,now());
+}
 // The render unwound without completing the tree. This happens in special
 // cases where need to exit the current render without producing a
 // consistent tree or committing.
@@ -1130,6 +1138,9 @@ function finishConcurrentRender(
 // This is a transition, so we should exit without committing a
 // placeholder and without scheduling a timeout. Delay indefinitely
 // until we receive more data.
+if(enableProfilerTimer&&enableComponentPerformanceTrack){
+finalizeRender(lanes,now());
+}
 constdidAttemptEntireTree=
 !workInProgressRootDidSkipSuspendedSiblings;
 markRootSuspended(
@@ -1655,19 +1666,31 @@ function prepareFreshStack(root: FiberRoot, lanes: Lanes): Fiber {
 
 if(includesSyncLane(lanes)||includesBlockingLane(lanes)){
 logBlockingStart(
-blockingUpdateTime,
-blockingEventTime,
+blockingUpdateTime>=0&&blockingUpdateTime<blockingClampTime
+ ? blockingClampTime
+ : blockingUpdateTime,
+blockingEventTime>=0&&blockingEventTime<blockingClampTime
+ ? blockingClampTime
+ : blockingEventTime,
 blockingEventType,
+blockingEventIsRepeat,
 renderStartTime,
 );
 clearBlockingTimers();
 }
 if(includesTransitionLane(lanes)){
 logTransitionStart(
-transitionStartTime,
-transitionUpdateTime,
-transitionEventTime,
+transitionStartTime>=0&&transitionStartTime<transitionClampTime
+ ? transitionClampTime
+ : transitionStartTime,
+transitionUpdateTime>=0&&transitionUpdateTime<transitionClampTime
+ ? transitionClampTime
+ : transitionUpdateTime,
+transitionEventTime>=0&&transitionEventTime<transitionClampTime
+ ? transitionClampTime
+ : transitionEventTime,
 transitionEventType,
+transitionEventIsRepeat,
 renderStartTime,
 );
 clearTransitionTimers();
@@ -3139,6 +3162,11 @@ function commitRootImpl(
 // with setTimeout
 pendingPassiveTransitions=transitions;
 scheduleCallback(NormalSchedulerPriority,()=>{
+if(enableProfilerTimer&&enableComponentPerformanceTrack){
+// Track the currently executing event if there is one so we can ignore this
+// event when logging events.
+trackSchedulerEvent();
+}
 flushPassiveEffects(true);
 // This render triggered passive effects: release the root cache pool
 // *after* passive effects fire to avoid freeing a cache pool that may

packages/react-reconciler/src/ReactProfilerTimer.js

@@ -36,14 +36,18 @@ export let componentEffectDuration: number = -0;
 exportletcomponentEffectStartTime: number=-1.1;
 exportletcomponentEffectEndTime: number=-1.1;
 
+exportletblockingClampTime: number=-0;
 exportletblockingUpdateTime: number=-1.1;// First sync setState scheduled.
 exportletblockingEventTime: number=-1.1;// Event timeStamp of the first setState.
 export letblockingEventType: null|string=null;// Event type of the first setState.
+exportletblockingEventIsRepeat: boolean=false;
 // TODO: This should really be one per Transition lane.
+exportlettransitionClampTime: number=-0;
 exportlettransitionStartTime: number=-1.1;// First startTransition call before setState.
 exportlettransitionUpdateTime: number=-1.1;// First transition setState scheduled.
 exportlettransitionEventTime: number=-1.1;// Event timeStamp of the first transition.
 export lettransitionEventType: null|string=null;// Event type of the first transition.
+exportlettransitionEventIsRepeat: boolean=false;
 
 exportfunctionstartUpdateTimerByLane(lane: Lane): void{
 if(!enableProfilerTimer||!enableComponentPerformanceTrack){
@@ -52,15 +56,25 @@ export function startUpdateTimerByLane(lane: Lane): void {
 if(isSyncLane(lane)||isBlockingLane(lane)){
 if(blockingUpdateTime<0){
 blockingUpdateTime=now();
-blockingEventTime=resolveEventTimeStamp();
-blockingEventType=resolveEventType();
+constnewEventTime=resolveEventTimeStamp();
+constnewEventType=resolveEventType();
+blockingEventIsRepeat=
+newEventTime===blockingEventTime&&
+newEventType===blockingEventType;
+blockingEventTime=newEventTime;
+blockingEventType=newEventType;
 }
 }elseif(isTransitionLane(lane)){
 if(transitionUpdateTime<0){
 transitionUpdateTime=now();
 if(transitionStartTime<0){
-transitionEventTime=resolveEventTimeStamp();
-transitionEventType=resolveEventType();
+constnewEventTime=resolveEventTimeStamp();
+constnewEventType=resolveEventType();
+transitionEventIsRepeat=
+newEventTime===transitionEventTime&&
+newEventType===transitionEventType;
+transitionEventTime=newEventTime;
+transitionEventType=newEventType;
 }
 }
 }
@@ -76,8 +90,13 @@ export function startAsyncTransitionTimer(): void {
 }
 if(transitionStartTime<0&&transitionUpdateTime<0){
 transitionStartTime=now();
-transitionEventTime=resolveEventTimeStamp();
-transitionEventType=resolveEventType();
+constnewEventTime=resolveEventTimeStamp();
+constnewEventType=resolveEventType();
+transitionEventIsRepeat=
+newEventTime===transitionEventTime&&
+newEventType===transitionEventType;
+transitionEventTime=newEventTime;
+transitionEventType=newEventType;
 }
 }
 
@@ -115,12 +134,7 @@ export function clampBlockingTimers(finalTime: number): void {
 // If we had new updates come in while we were still rendering or committing, we don't want
 // those update times to create overlapping tracks in the performance timeline so we clamp
 // them to the end of the commit phase.
-if(blockingUpdateTime>=0&&blockingUpdateTime<finalTime){
-blockingUpdateTime=finalTime;
-}
-if(blockingEventTime>=0&&blockingEventTime<finalTime){
-blockingEventTime=finalTime;
-}
+blockingClampTime=finalTime;
 }
 
 exportfunctionclampTransitionTimers(finalTime: number): void{
@@ -130,15 +144,7 @@ export function clampTransitionTimers(finalTime: number): void {
 // If we had new updates come in while we were still rendering or committing, we don't want
 // those update times to create overlapping tracks in the performance timeline so we clamp
 // them to the end of the commit phase.
-if(transitionStartTime>=0&&transitionStartTime<finalTime){
-transitionStartTime=finalTime;
-}
-if(transitionUpdateTime>=0&&transitionUpdateTime<finalTime){
-transitionUpdateTime=finalTime;
-}
-if(transitionEventTime>=0&&transitionEventTime<finalTime){
-transitionEventTime=finalTime;
-}
+transitionClampTime=finalTime;
 }
 
 exportfunctionpushNestedEffectDurations(): number{

packages/react-reconciler/src/__tests__/ReactFiberHostContext-test.internal.js

@@ -83,6 +83,7 @@ describe('ReactFiberHostContext', () => {
 }
 returnDefaultEventPriority;
 },
+trackSchedulerEvent: function(){},
 resolveEventType: function(){
 returnnull;
 },

packages/react-art/src/ReactFiberConfigART.js

@@ -363,6 +363,8 @@ export function resolveUpdatePriority(): EventPriority {
 returncurrentUpdatePriority||DefaultEventPriority;
 }
 
+exportfunctiontrackSchedulerEvent(): void{}
+
 export functionresolveEventType(): null|string{
 returnnull;
 }

packages/react-dom-bindings/src/client/ReactFiberConfigDOM.js

@@ -606,14 +606,19 @@ export function shouldAttemptEagerTransition(): boolean {
 returnfalse;
 }
 
+letschedulerEvent: void|Event=undefined;
+exportfunctiontrackSchedulerEvent(): void{
+schedulerEvent=window.event;
+}
+
 export functionresolveEventType(): null|string{
 constevent=window.event;
-returnevent ? event.type : null;
+returnevent&&event!==schedulerEvent? event.type : null;
 }
 
 exportfunctionresolveEventTimeStamp(): number{
 constevent=window.event;
-returnevent ? event.timeStamp : -1.1;
+returnevent&&event!==schedulerEvent? event.timeStamp : -1.1;
 }
 
 exportconstisPrimaryRenderer=true;

packages/react-native-renderer/src/ReactFiberConfigFabric.js

@@ -372,6 +372,8 @@ export function resolveUpdatePriority(): EventPriority {
 returnDefaultEventPriority;
 }
 
+exportfunctiontrackSchedulerEvent(): void{}
+
 export functionresolveEventType(): null|string{
 returnnull;
 }

packages/react-native-renderer/src/ReactFiberConfigNative.js

@@ -288,6 +288,8 @@ export function resolveUpdatePriority(): EventPriority {
 returnDefaultEventPriority;
 }
 
+exportfunctiontrackSchedulerEvent(): void{}
+
 export functionresolveEventType(): null|string{
 returnnull;
 }

packages/react-noop-renderer/src/createReactNoop.js

@@ -531,6 +531,8 @@ function createReactNoop(reconciler: Function, useMutation: boolean) {
 returncurrentEventPriority;
 },
 
+trackSchedulerEvent(): void{},
+
 resolveEventType(): null|string{
  return null;
 },

packages/react-reconciler/src/ReactFiberPerformanceTrack.js

@@ -118,6 +118,7 @@ export function logBlockingStart(
 updateTime: number,
 eventTime: number,
 eventType: null|string,
+eventIsRepeat: boolean,
 renderStartTime: number,
 ): void{
 if(supportsUserTiming){
@@ -127,7 +128,7 @@ export function logBlockingStart(
 reusableLaneDevToolDetails.color='secondary-dark';
 reusableLaneOptions.start=eventTime;
 reusableLaneOptions.end=updateTime>0 ? updateTime : renderStartTime;
-performance.measure(eventType,reusableLaneOptions);
+performance.measure(eventIsRepeat ? '' : eventType,reusableLaneOptions);
 }
 if(updateTime>0){
 // Log the time from when we called setState until we started rendering.
@@ -144,6 +145,7 @@ export function logTransitionStart(
 updateTime: number,
 eventTime: number,
 eventType: null|string,
+eventIsRepeat: boolean,
 renderStartTime: number,
 ): void{
 if(supportsUserTiming){
@@ -158,7 +160,7 @@ export function logTransitionStart(
  : updateTime>0
  ? updateTime
  : renderStartTime;
-performance.measure(eventType,reusableLaneOptions);
+performance.measure(eventIsRepeat ? '' : eventType,reusableLaneOptions);
 }
 if(startTime>0){
 // Log the time from when we started an async transition until we called setState or started rendering.

packages/react-reconciler/src/ReactFiberRootScheduler.js

@@ -18,6 +18,7 @@ import {
 disableSchedulerTimeoutInWorkLoop,
 enableProfilerTimer,
 enableProfilerNestedUpdatePhase,
+enableComponentPerformanceTrack,
 enableSiblingPrerendering,
 }from'shared/ReactFeatureFlags';
 import{
@@ -64,6 +65,7 @@ import {
 supportsMicrotasks,
 scheduleMicrotask,
 shouldAttemptEagerTransition,
+trackSchedulerEvent,
 }from'./ReactFiberConfig';
 
 importReactSharedInternalsfrom'shared/ReactSharedInternals';
@@ -225,6 +227,12 @@ function flushSyncWorkAcrossRoots_impl(
 }
 
 functionprocessRootScheduleInMicrotask(){
+if(enableProfilerTimer&&enableComponentPerformanceTrack){
+// Track the currently executing event if there is one so we can ignore this
+// event when logging events.
+trackSchedulerEvent();
+}
+
 // This function is always called inside a microtask. It should never be
 // called synchronously.
 didScheduleMicrotask=false;
@@ -428,6 +436,12 @@ function performWorkOnRootViaSchedulerTask(
 resetNestedUpdateFlag();
 }
 
+if(enableProfilerTimer&&enableComponentPerformanceTrack){
+// Track the currently executing event if there is one so we can ignore this
+// event when logging events.
+trackSchedulerEvent();
+}
+
 // Flush any pending passive effects before deciding which lanes to work on,
 // in case they schedule additional work.
 constoriginalCallbackNode=root.callbackNode;

packages/react-reconciler/src/ReactFiberWorkLoop.js

@@ -90,6 +90,7 @@ import {
 setCurrentUpdatePriority,
 getCurrentUpdatePriority,
 resolveUpdatePriority,
+trackSchedulerEvent,
 }from'./ReactFiberConfig';
 
 import{createWorkInProgress,resetWorkInProgress}from'./ReactFiber';
@@ -229,13 +230,17 @@ import {
 }from'./ReactFiberConcurrentUpdates';
 
 import{
+blockingClampTime,
 blockingUpdateTime,
 blockingEventTime,
 blockingEventType,
+blockingEventIsRepeat,
+transitionClampTime,
 transitionStartTime,
 transitionUpdateTime,
 transitionEventTime,
 transitionEventType,
+transitionEventIsRepeat,
 clearBlockingTimers,
 clearTransitionTimers,
 clampBlockingTimers,
@@ -938,6 +943,9 @@ export function performWorkOnRoot(
 }
 break;
 }elseif(exitStatus===RootDidNotComplete){
+if(enableProfilerTimer&&enableComponentPerformanceTrack){
+finalizeRender(lanes,now());
+}
 // The render unwound without completing the tree. This happens in special
 // cases where need to exit the current render without producing a
 // consistent tree or committing.
@@ -1130,6 +1138,9 @@ function finishConcurrentRender(
 // This is a transition, so we should exit without committing a
 // placeholder and without scheduling a timeout. Delay indefinitely
 // until we receive more data.
+if(enableProfilerTimer&&enableComponentPerformanceTrack){
+finalizeRender(lanes,now());
+}
 constdidAttemptEntireTree=
 !workInProgressRootDidSkipSuspendedSiblings;
 markRootSuspended(
@@ -1655,19 +1666,31 @@ function prepareFreshStack(root: FiberRoot, lanes: Lanes): Fiber {
 
 if(includesSyncLane(lanes)||includesBlockingLane(lanes)){
 logBlockingStart(
-blockingUpdateTime,
-blockingEventTime,
+blockingUpdateTime>=0&&blockingUpdateTime<blockingClampTime
+ ? blockingClampTime
+ : blockingUpdateTime,
+blockingEventTime>=0&&blockingEventTime<blockingClampTime
+ ? blockingClampTime
+ : blockingEventTime,
 blockingEventType,
+blockingEventIsRepeat,
 renderStartTime,
 );
 clearBlockingTimers();
 }
 if(includesTransitionLane(lanes)){
 logTransitionStart(
-transitionStartTime,
-transitionUpdateTime,
-transitionEventTime,
+transitionStartTime>=0&&transitionStartTime<transitionClampTime
+ ? transitionClampTime
+ : transitionStartTime,
+transitionUpdateTime>=0&&transitionUpdateTime<transitionClampTime
+ ? transitionClampTime
+ : transitionUpdateTime,
+transitionEventTime>=0&&transitionEventTime<transitionClampTime
+ ? transitionClampTime
+ : transitionEventTime,
 transitionEventType,
+transitionEventIsRepeat,
 renderStartTime,
 );
 clearTransitionTimers();
@@ -3139,6 +3162,11 @@ function commitRootImpl(
 // with setTimeout
 pendingPassiveTransitions=transitions;
 scheduleCallback(NormalSchedulerPriority,()=>{
+if(enableProfilerTimer&&enableComponentPerformanceTrack){
+// Track the currently executing event if there is one so we can ignore this
+// event when logging events.
+trackSchedulerEvent();
+}
 flushPassiveEffects(true);
 // This render triggered passive effects: release the root cache pool
 // *after* passive effects fire to avoid freeing a cache pool that may

packages/react-reconciler/src/ReactProfilerTimer.js

@@ -36,14 +36,18 @@ export let componentEffectDuration: number = -0;
 exportletcomponentEffectStartTime: number=-1.1;
 exportletcomponentEffectEndTime: number=-1.1;
 
+exportletblockingClampTime: number=-0;
 exportletblockingUpdateTime: number=-1.1;// First sync setState scheduled.
 exportletblockingEventTime: number=-1.1;// Event timeStamp of the first setState.
 export letblockingEventType: null|string=null;// Event type of the first setState.
+exportletblockingEventIsRepeat: boolean=false;
 // TODO: This should really be one per Transition lane.
+exportlettransitionClampTime: number=-0;
 exportlettransitionStartTime: number=-1.1;// First startTransition call before setState.
 exportlettransitionUpdateTime: number=-1.1;// First transition setState scheduled.
 exportlettransitionEventTime: number=-1.1;// Event timeStamp of the first transition.
 export lettransitionEventType: null|string=null;// Event type of the first transition.
+exportlettransitionEventIsRepeat: boolean=false;
 
 exportfunctionstartUpdateTimerByLane(lane: Lane): void{
 if(!enableProfilerTimer||!enableComponentPerformanceTrack){
@@ -52,15 +56,25 @@ export function startUpdateTimerByLane(lane: Lane): void {
 if(isSyncLane(lane)||isBlockingLane(lane)){
 if(blockingUpdateTime<0){
 blockingUpdateTime=now();
-blockingEventTime=resolveEventTimeStamp();
-blockingEventType=resolveEventType();
+constnewEventTime=resolveEventTimeStamp();
+constnewEventType=resolveEventType();
+blockingEventIsRepeat=
+newEventTime===blockingEventTime&&
+newEventType===blockingEventType;
+blockingEventTime=newEventTime;
+blockingEventType=newEventType;
 }
 }elseif(isTransitionLane(lane)){
 if(transitionUpdateTime<0){
 transitionUpdateTime=now();
 if(transitionStartTime<0){
-transitionEventTime=resolveEventTimeStamp();
-transitionEventType=resolveEventType();
+constnewEventTime=resolveEventTimeStamp();
+constnewEventType=resolveEventType();
+transitionEventIsRepeat=
+newEventTime===transitionEventTime&&
+newEventType===transitionEventType;
+transitionEventTime=newEventTime;
+transitionEventType=newEventType;
 }
 }
 }
@@ -76,8 +90,13 @@ export function startAsyncTransitionTimer(): void {
 }
 if(transitionStartTime<0&&transitionUpdateTime<0){
 transitionStartTime=now();
-transitionEventTime=resolveEventTimeStamp();
-transitionEventType=resolveEventType();
+constnewEventTime=resolveEventTimeStamp();
+constnewEventType=resolveEventType();
+transitionEventIsRepeat=
+newEventTime===transitionEventTime&&
+newEventType===transitionEventType;
+transitionEventTime=newEventTime;
+transitionEventType=newEventType;
 }
 }
 
@@ -115,12 +134,7 @@ export function clampBlockingTimers(finalTime: number): void {
 // If we had new updates come in while we were still rendering or committing, we don't want
 // those update times to create overlapping tracks in the performance timeline so we clamp
 // them to the end of the commit phase.
-if(blockingUpdateTime>=0&&blockingUpdateTime<finalTime){
-blockingUpdateTime=finalTime;
-}
-if(blockingEventTime>=0&&blockingEventTime<finalTime){
-blockingEventTime=finalTime;
-}
+blockingClampTime=finalTime;
 }
 
 exportfunctionclampTransitionTimers(finalTime: number): void{
@@ -130,15 +144,7 @@ export function clampTransitionTimers(finalTime: number): void {
 // If we had new updates come in while we were still rendering or committing, we don't want
 // those update times to create overlapping tracks in the performance timeline so we clamp
 // them to the end of the commit phase.
-if(transitionStartTime>=0&&transitionStartTime<finalTime){
-transitionStartTime=finalTime;
-}
-if(transitionUpdateTime>=0&&transitionUpdateTime<finalTime){
-transitionUpdateTime=finalTime;
-}
-if(transitionEventTime>=0&&transitionEventTime<finalTime){
-transitionEventTime=finalTime;
-}
+transitionClampTime=finalTime;
 }
 
 exportfunctionpushNestedEffectDurations(): number{

packages/react-reconciler/src/__tests__/ReactFiberHostContext-test.internal.js

@@ -83,6 +83,7 @@ describe('ReactFiberHostContext', () => {
 }
 returnDefaultEventPriority;
 },
+trackSchedulerEvent: function(){},
 resolveEventType: function(){
 returnnull;
 },

packages/react-art/src/ReactFiberConfigART.js

@@ -363,6 +363,8 @@ export function resolveUpdatePriority(): EventPriority {
 returncurrentUpdatePriority||DefaultEventPriority;
 }
 
+exportfunctiontrackSchedulerEvent(): void{}
+
 export functionresolveEventType(): null|string{
 returnnull;
 }

packages/react-dom-bindings/src/client/ReactFiberConfigDOM.js

@@ -606,14 +606,19 @@ export function shouldAttemptEagerTransition(): boolean {
 returnfalse;
 }
 
+letschedulerEvent: void|Event=undefined;
+exportfunctiontrackSchedulerEvent(): void{
+schedulerEvent=window.event;
+}
+
 export functionresolveEventType(): null|string{
 constevent=window.event;
-returnevent ? event.type : null;
+returnevent&&event!==schedulerEvent? event.type : null;
 }
 
 exportfunctionresolveEventTimeStamp(): number{
 constevent=window.event;
-returnevent ? event.timeStamp : -1.1;
+returnevent&&event!==schedulerEvent? event.timeStamp : -1.1;
 }
 
 exportconstisPrimaryRenderer=true;

packages/react-native-renderer/src/ReactFiberConfigFabric.js

@@ -372,6 +372,8 @@ export function resolveUpdatePriority(): EventPriority {
 returnDefaultEventPriority;
 }
 
+exportfunctiontrackSchedulerEvent(): void{}
+
 export functionresolveEventType(): null|string{
 returnnull;
 }

packages/react-native-renderer/src/ReactFiberConfigNative.js

@@ -288,6 +288,8 @@ export function resolveUpdatePriority(): EventPriority {
 returnDefaultEventPriority;
 }
 
+exportfunctiontrackSchedulerEvent(): void{}
+
 export functionresolveEventType(): null|string{
 returnnull;
 }

packages/react-noop-renderer/src/createReactNoop.js

@@ -531,6 +531,8 @@ function createReactNoop(reconciler: Function, useMutation: boolean) {
 returncurrentEventPriority;
 },
 
+trackSchedulerEvent(): void{},
+
 resolveEventType(): null|string{
  return null;
 },

packages/react-reconciler/src/ReactFiberPerformanceTrack.js

@@ -118,6 +118,7 @@ export function logBlockingStart(
 updateTime: number,
 eventTime: number,
 eventType: null|string,
+eventIsRepeat: boolean,
 renderStartTime: number,
 ): void{
 if(supportsUserTiming){
@@ -127,7 +128,7 @@ export function logBlockingStart(
 reusableLaneDevToolDetails.color='secondary-dark';
 reusableLaneOptions.start=eventTime;
 reusableLaneOptions.end=updateTime>0 ? updateTime : renderStartTime;
-performance.measure(eventType,reusableLaneOptions);
+performance.measure(eventIsRepeat ? '' : eventType,reusableLaneOptions);
 }
 if(updateTime>0){
 // Log the time from when we called setState until we started rendering.
@@ -144,6 +145,7 @@ export function logTransitionStart(
 updateTime: number,
 eventTime: number,
 eventType: null|string,
+eventIsRepeat: boolean,
 renderStartTime: number,
 ): void{
 if(supportsUserTiming){
@@ -158,7 +160,7 @@ export function logTransitionStart(
  : updateTime>0
  ? updateTime
  : renderStartTime;
-performance.measure(eventType,reusableLaneOptions);
+performance.measure(eventIsRepeat ? '' : eventType,reusableLaneOptions);
 }
 if(startTime>0){
 // Log the time from when we started an async transition until we called setState or started rendering.

packages/react-reconciler/src/ReactFiberRootScheduler.js

@@ -18,6 +18,7 @@ import {
 disableSchedulerTimeoutInWorkLoop,
 enableProfilerTimer,
 enableProfilerNestedUpdatePhase,
+enableComponentPerformanceTrack,
 enableSiblingPrerendering,
 }from'shared/ReactFeatureFlags';
 import{
@@ -64,6 +65,7 @@ import {
 supportsMicrotasks,
 scheduleMicrotask,
 shouldAttemptEagerTransition,
+trackSchedulerEvent,
 }from'./ReactFiberConfig';
 
 importReactSharedInternalsfrom'shared/ReactSharedInternals';
@@ -225,6 +227,12 @@ function flushSyncWorkAcrossRoots_impl(
 }
 
 functionprocessRootScheduleInMicrotask(){
+if(enableProfilerTimer&&enableComponentPerformanceTrack){
+// Track the currently executing event if there is one so we can ignore this
+// event when logging events.
+trackSchedulerEvent();
+}
+
 // This function is always called inside a microtask. It should never be
 // called synchronously.
 didScheduleMicrotask=false;
@@ -428,6 +436,12 @@ function performWorkOnRootViaSchedulerTask(
 resetNestedUpdateFlag();
 }
 
+if(enableProfilerTimer&&enableComponentPerformanceTrack){
+// Track the currently executing event if there is one so we can ignore this
+// event when logging events.
+trackSchedulerEvent();
+}
+
 // Flush any pending passive effects before deciding which lanes to work on,
 // in case they schedule additional work.
 constoriginalCallbackNode=root.callbackNode;

packages/react-reconciler/src/ReactFiberWorkLoop.js

@@ -90,6 +90,7 @@ import {
 setCurrentUpdatePriority,
 getCurrentUpdatePriority,
 resolveUpdatePriority,
+trackSchedulerEvent,
 }from'./ReactFiberConfig';
 
 import{createWorkInProgress,resetWorkInProgress}from'./ReactFiber';
@@ -229,13 +230,17 @@ import {
 }from'./ReactFiberConcurrentUpdates';
 
 import{
+blockingClampTime,
 blockingUpdateTime,
 blockingEventTime,
 blockingEventType,
+blockingEventIsRepeat,
+transitionClampTime,
 transitionStartTime,
 transitionUpdateTime,
 transitionEventTime,
 transitionEventType,
+transitionEventIsRepeat,
 clearBlockingTimers,
 clearTransitionTimers,
 clampBlockingTimers,
@@ -938,6 +943,9 @@ export function performWorkOnRoot(
 }
 break;
 }elseif(exitStatus===RootDidNotComplete){
+if(enableProfilerTimer&&enableComponentPerformanceTrack){
+finalizeRender(lanes,now());
+}
 // The render unwound without completing the tree. This happens in special
 // cases where need to exit the current render without producing a
 // consistent tree or committing.
@@ -1130,6 +1138,9 @@ function finishConcurrentRender(
 // This is a transition, so we should exit without committing a
 // placeholder and without scheduling a timeout. Delay indefinitely
 // until we receive more data.
+if(enableProfilerTimer&&enableComponentPerformanceTrack){
+finalizeRender(lanes,now());
+}
 constdidAttemptEntireTree=
 !workInProgressRootDidSkipSuspendedSiblings;
 markRootSuspended(
@@ -1655,19 +1666,31 @@ function prepareFreshStack(root: FiberRoot, lanes: Lanes): Fiber {
 
 if(includesSyncLane(lanes)||includesBlockingLane(lanes)){
 logBlockingStart(
-blockingUpdateTime,
-blockingEventTime,
+blockingUpdateTime>=0&&blockingUpdateTime<blockingClampTime
+ ? blockingClampTime
+ : blockingUpdateTime,
+blockingEventTime>=0&&blockingEventTime<blockingClampTime
+ ? blockingClampTime
+ : blockingEventTime,
 blockingEventType,
+blockingEventIsRepeat,
 renderStartTime,
 );
 clearBlockingTimers();
 }
 if(includesTransitionLane(lanes)){
 logTransitionStart(
-transitionStartTime,
-transitionUpdateTime,
-transitionEventTime,
+transitionStartTime>=0&&transitionStartTime<transitionClampTime
+ ? transitionClampTime
+ : transitionStartTime,
+transitionUpdateTime>=0&&transitionUpdateTime<transitionClampTime
+ ? transitionClampTime
+ : transitionUpdateTime,
+transitionEventTime>=0&&transitionEventTime<transitionClampTime
+ ? transitionClampTime
+ : transitionEventTime,
 transitionEventType,
+transitionEventIsRepeat,
 renderStartTime,
 );
 clearTransitionTimers();
@@ -3139,6 +3162,11 @@ function commitRootImpl(
 // with setTimeout
 pendingPassiveTransitions=transitions;
 scheduleCallback(NormalSchedulerPriority,()=>{
+if(enableProfilerTimer&&enableComponentPerformanceTrack){
+// Track the currently executing event if there is one so we can ignore this
+// event when logging events.
+trackSchedulerEvent();
+}
 flushPassiveEffects(true);
 // This render triggered passive effects: release the root cache pool
 // *after* passive effects fire to avoid freeing a cache pool that may

packages/react-reconciler/src/ReactProfilerTimer.js

@@ -36,14 +36,18 @@ export let componentEffectDuration: number = -0;
 exportletcomponentEffectStartTime: number=-1.1;
 exportletcomponentEffectEndTime: number=-1.1;
 
+exportletblockingClampTime: number=-0;
 exportletblockingUpdateTime: number=-1.1;// First sync setState scheduled.
 exportletblockingEventTime: number=-1.1;// Event timeStamp of the first setState.
 export letblockingEventType: null|string=null;// Event type of the first setState.
+exportletblockingEventIsRepeat: boolean=false;
 // TODO: This should really be one per Transition lane.
+exportlettransitionClampTime: number=-0;
 exportlettransitionStartTime: number=-1.1;// First startTransition call before setState.
 exportlettransitionUpdateTime: number=-1.1;// First transition setState scheduled.
 exportlettransitionEventTime: number=-1.1;// Event timeStamp of the first transition.
 export lettransitionEventType: null|string=null;// Event type of the first transition.
+exportlettransitionEventIsRepeat: boolean=false;
 
 exportfunctionstartUpdateTimerByLane(lane: Lane): void{
 if(!enableProfilerTimer||!enableComponentPerformanceTrack){
@@ -52,15 +56,25 @@ export function startUpdateTimerByLane(lane: Lane): void {
 if(isSyncLane(lane)||isBlockingLane(lane)){
 if(blockingUpdateTime<0){
 blockingUpdateTime=now();
-blockingEventTime=resolveEventTimeStamp();
-blockingEventType=resolveEventType();
+constnewEventTime=resolveEventTimeStamp();
+constnewEventType=resolveEventType();
+blockingEventIsRepeat=
+newEventTime===blockingEventTime&&
+newEventType===blockingEventType;
+blockingEventTime=newEventTime;
+blockingEventType=newEventType;
 }
 }elseif(isTransitionLane(lane)){
 if(transitionUpdateTime<0){
 transitionUpdateTime=now();
 if(transitionStartTime<0){
-transitionEventTime=resolveEventTimeStamp();
-transitionEventType=resolveEventType();
+constnewEventTime=resolveEventTimeStamp();
+constnewEventType=resolveEventType();
+transitionEventIsRepeat=
+newEventTime===transitionEventTime&&
+newEventType===transitionEventType;
+transitionEventTime=newEventTime;
+transitionEventType=newEventType;
 }
 }
 }
@@ -76,8 +90,13 @@ export function startAsyncTransitionTimer(): void {
 }
 if(transitionStartTime<0&&transitionUpdateTime<0){
 transitionStartTime=now();
-transitionEventTime=resolveEventTimeStamp();
-transitionEventType=resolveEventType();
+constnewEventTime=resolveEventTimeStamp();
+constnewEventType=resolveEventType();
+transitionEventIsRepeat=
+newEventTime===transitionEventTime&&
+newEventType===transitionEventType;
+transitionEventTime=newEventTime;
+transitionEventType=newEventType;
 }
 }
 
@@ -115,12 +134,7 @@ export function clampBlockingTimers(finalTime: number): void {
 // If we had new updates come in while we were still rendering or committing, we don't want
 // those update times to create overlapping tracks in the performance timeline so we clamp
 // them to the end of the commit phase.
-if(blockingUpdateTime>=0&&blockingUpdateTime<finalTime){
-blockingUpdateTime=finalTime;
-}
-if(blockingEventTime>=0&&blockingEventTime<finalTime){
-blockingEventTime=finalTime;
-}
+blockingClampTime=finalTime;
 }
 
 exportfunctionclampTransitionTimers(finalTime: number): void{
@@ -130,15 +144,7 @@ export function clampTransitionTimers(finalTime: number): void {
 // If we had new updates come in while we were still rendering or committing, we don't want
 // those update times to create overlapping tracks in the performance timeline so we clamp
 // them to the end of the commit phase.
-if(transitionStartTime>=0&&transitionStartTime<finalTime){
-transitionStartTime=finalTime;
-}
-if(transitionUpdateTime>=0&&transitionUpdateTime<finalTime){
-transitionUpdateTime=finalTime;
-}
-if(transitionEventTime>=0&&transitionEventTime<finalTime){
-transitionEventTime=finalTime;
-}
+transitionClampTime=finalTime;
 }
 
 exportfunctionpushNestedEffectDurations(): number{

packages/react-reconciler/src/__tests__/ReactFiberHostContext-test.internal.js

@@ -83,6 +83,7 @@ describe('ReactFiberHostContext', () => {
 }
 returnDefaultEventPriority;
 },
+trackSchedulerEvent: function(){},
 resolveEventType: function(){
 returnnull;
 },

packages/react-art/src/ReactFiberConfigART.js

@@ -363,6 +363,8 @@ export function resolveUpdatePriority(): EventPriority {
 returncurrentUpdatePriority||DefaultEventPriority;
 }
 
+exportfunctiontrackSchedulerEvent(): void{}
+
 export functionresolveEventType(): null|string{
 returnnull;
 }

packages/react-dom-bindings/src/client/ReactFiberConfigDOM.js

@@ -606,14 +606,19 @@ export function shouldAttemptEagerTransition(): boolean {
 returnfalse;
 }
 
+letschedulerEvent: void|Event=undefined;
+exportfunctiontrackSchedulerEvent(): void{
+schedulerEvent=window.event;
+}
+
 export functionresolveEventType(): null|string{
 constevent=window.event;
-returnevent ? event.type : null;
+returnevent&&event!==schedulerEvent? event.type : null;
 }
 
 exportfunctionresolveEventTimeStamp(): number{
 constevent=window.event;
-returnevent ? event.timeStamp : -1.1;
+returnevent&&event!==schedulerEvent? event.timeStamp : -1.1;
 }
 
 exportconstisPrimaryRenderer=true;

packages/react-native-renderer/src/ReactFiberConfigFabric.js

@@ -372,6 +372,8 @@ export function resolveUpdatePriority(): EventPriority {
 returnDefaultEventPriority;
 }
 
+exportfunctiontrackSchedulerEvent(): void{}
+
 export functionresolveEventType(): null|string{
 returnnull;
 }

packages/react-native-renderer/src/ReactFiberConfigNative.js

@@ -288,6 +288,8 @@ export function resolveUpdatePriority(): EventPriority {
 returnDefaultEventPriority;
 }
 
+exportfunctiontrackSchedulerEvent(): void{}
+
 export functionresolveEventType(): null|string{
 returnnull;
 }

packages/react-noop-renderer/src/createReactNoop.js

@@ -531,6 +531,8 @@ function createReactNoop(reconciler: Function, useMutation: boolean) {
 returncurrentEventPriority;
 },
 
+trackSchedulerEvent(): void{},
+
 resolveEventType(): null|string{
  return null;
 },

packages/react-reconciler/src/ReactFiberPerformanceTrack.js

@@ -118,6 +118,7 @@ export function logBlockingStart(
 updateTime: number,
 eventTime: number,
 eventType: null|string,
+eventIsRepeat: boolean,
 renderStartTime: number,
 ): void{
 if(supportsUserTiming){
@@ -127,7 +128,7 @@ export function logBlockingStart(
 reusableLaneDevToolDetails.color='secondary-dark';
 reusableLaneOptions.start=eventTime;
 reusableLaneOptions.end=updateTime>0 ? updateTime : renderStartTime;
-performance.measure(eventType,reusableLaneOptions);
+performance.measure(eventIsRepeat ? '' : eventType,reusableLaneOptions);
 }
 if(updateTime>0){
 // Log the time from when we called setState until we started rendering.
@@ -144,6 +145,7 @@ export function logTransitionStart(
 updateTime: number,
 eventTime: number,
 eventType: null|string,
+eventIsRepeat: boolean,
 renderStartTime: number,
 ): void{
 if(supportsUserTiming){
@@ -158,7 +160,7 @@ export function logTransitionStart(
  : updateTime>0
  ? updateTime
  : renderStartTime;
-performance.measure(eventType,reusableLaneOptions);
+performance.measure(eventIsRepeat ? '' : eventType,reusableLaneOptions);
 }
 if(startTime>0){
 // Log the time from when we started an async transition until we called setState or started rendering.

packages/react-reconciler/src/ReactFiberRootScheduler.js

@@ -18,6 +18,7 @@ import {
 disableSchedulerTimeoutInWorkLoop,
 enableProfilerTimer,
 enableProfilerNestedUpdatePhase,
+enableComponentPerformanceTrack,
 enableSiblingPrerendering,
 }from'shared/ReactFeatureFlags';
 import{
@@ -64,6 +65,7 @@ import {
 supportsMicrotasks,
 scheduleMicrotask,
 shouldAttemptEagerTransition,
+trackSchedulerEvent,
 }from'./ReactFiberConfig';
 
 importReactSharedInternalsfrom'shared/ReactSharedInternals';
@@ -225,6 +227,12 @@ function flushSyncWorkAcrossRoots_impl(
 }
 
 functionprocessRootScheduleInMicrotask(){
+if(enableProfilerTimer&&enableComponentPerformanceTrack){
+// Track the currently executing event if there is one so we can ignore this
+// event when logging events.
+trackSchedulerEvent();
+}
+
 // This function is always called inside a microtask. It should never be
 // called synchronously.
 didScheduleMicrotask=false;
@@ -428,6 +436,12 @@ function performWorkOnRootViaSchedulerTask(
 resetNestedUpdateFlag();
 }
 
+if(enableProfilerTimer&&enableComponentPerformanceTrack){
+// Track the currently executing event if there is one so we can ignore this
+// event when logging events.
+trackSchedulerEvent();
+}
+
 // Flush any pending passive effects before deciding which lanes to work on,
 // in case they schedule additional work.
 constoriginalCallbackNode=root.callbackNode;

packages/react-reconciler/src/ReactFiberWorkLoop.js

@@ -90,6 +90,7 @@ import {
 setCurrentUpdatePriority,
 getCurrentUpdatePriority,
 resolveUpdatePriority,
+trackSchedulerEvent,
 }from'./ReactFiberConfig';
 
 import{createWorkInProgress,resetWorkInProgress}from'./ReactFiber';
@@ -229,13 +230,17 @@ import {
 }from'./ReactFiberConcurrentUpdates';
 
 import{
+blockingClampTime,
 blockingUpdateTime,
 blockingEventTime,
 blockingEventType,
+blockingEventIsRepeat,
+transitionClampTime,
 transitionStartTime,
 transitionUpdateTime,
 transitionEventTime,
 transitionEventType,
+transitionEventIsRepeat,
 clearBlockingTimers,
 clearTransitionTimers,
 clampBlockingTimers,
@@ -938,6 +943,9 @@ export function performWorkOnRoot(
 }
 break;
 }elseif(exitStatus===RootDidNotComplete){
+if(enableProfilerTimer&&enableComponentPerformanceTrack){
+finalizeRender(lanes,now());
+}
 // The render unwound without completing the tree. This happens in special
 // cases where need to exit the current render without producing a
 // consistent tree or committing.
@@ -1130,6 +1138,9 @@ function finishConcurrentRender(
 // This is a transition, so we should exit without committing a
 // placeholder and without scheduling a timeout. Delay indefinitely
 // until we receive more data.
+if(enableProfilerTimer&&enableComponentPerformanceTrack){
+finalizeRender(lanes,now());
+}
 constdidAttemptEntireTree=
 !workInProgressRootDidSkipSuspendedSiblings;
 markRootSuspended(
@@ -1655,19 +1666,31 @@ function prepareFreshStack(root: FiberRoot, lanes: Lanes): Fiber {
 
 if(includesSyncLane(lanes)||includesBlockingLane(lanes)){
 logBlockingStart(
-blockingUpdateTime,
-blockingEventTime,
+blockingUpdateTime>=0&&blockingUpdateTime<blockingClampTime
+ ? blockingClampTime
+ : blockingUpdateTime,
+blockingEventTime>=0&&blockingEventTime<blockingClampTime
+ ? blockingClampTime
+ : blockingEventTime,
 blockingEventType,
+blockingEventIsRepeat,
 renderStartTime,
 );
 clearBlockingTimers();
 }
 if(includesTransitionLane(lanes)){
 logTransitionStart(
-transitionStartTime,
-transitionUpdateTime,
-transitionEventTime,
+transitionStartTime>=0&&transitionStartTime<transitionClampTime
+ ? transitionClampTime
+ : transitionStartTime,
+transitionUpdateTime>=0&&transitionUpdateTime<transitionClampTime
+ ? transitionClampTime
+ : transitionUpdateTime,
+transitionEventTime>=0&&transitionEventTime<transitionClampTime
+ ? transitionClampTime
+ : transitionEventTime,
 transitionEventType,
+transitionEventIsRepeat,
 renderStartTime,
 );
 clearTransitionTimers();
@@ -3139,6 +3162,11 @@ function commitRootImpl(
 // with setTimeout
 pendingPassiveTransitions=transitions;
 scheduleCallback(NormalSchedulerPriority,()=>{
+if(enableProfilerTimer&&enableComponentPerformanceTrack){
+// Track the currently executing event if there is one so we can ignore this
+// event when logging events.
+trackSchedulerEvent();
+}
 flushPassiveEffects(true);
 // This render triggered passive effects: release the root cache pool
 // *after* passive effects fire to avoid freeing a cache pool that may

packages/react-reconciler/src/ReactProfilerTimer.js

@@ -36,14 +36,18 @@ export let componentEffectDuration: number = -0;
 exportletcomponentEffectStartTime: number=-1.1;
 exportletcomponentEffectEndTime: number=-1.1;
 
+exportletblockingClampTime: number=-0;
 exportletblockingUpdateTime: number=-1.1;// First sync setState scheduled.
 exportletblockingEventTime: number=-1.1;// Event timeStamp of the first setState.
 export letblockingEventType: null|string=null;// Event type of the first setState.
+exportletblockingEventIsRepeat: boolean=false;
 // TODO: This should really be one per Transition lane.
+exportlettransitionClampTime: number=-0;
 exportlettransitionStartTime: number=-1.1;// First startTransition call before setState.
 exportlettransitionUpdateTime: number=-1.1;// First transition setState scheduled.
 exportlettransitionEventTime: number=-1.1;// Event timeStamp of the first transition.
 export lettransitionEventType: null|string=null;// Event type of the first transition.
+exportlettransitionEventIsRepeat: boolean=false;
 
 exportfunctionstartUpdateTimerByLane(lane: Lane): void{
 if(!enableProfilerTimer||!enableComponentPerformanceTrack){
@@ -52,15 +56,25 @@ export function startUpdateTimerByLane(lane: Lane): void {
 if(isSyncLane(lane)||isBlockingLane(lane)){
 if(blockingUpdateTime<0){
 blockingUpdateTime=now();
-blockingEventTime=resolveEventTimeStamp();
-blockingEventType=resolveEventType();
+constnewEventTime=resolveEventTimeStamp();
+constnewEventType=resolveEventType();
+blockingEventIsRepeat=
+newEventTime===blockingEventTime&&
+newEventType===blockingEventType;
+blockingEventTime=newEventTime;
+blockingEventType=newEventType;
 }
 }elseif(isTransitionLane(lane)){
 if(transitionUpdateTime<0){
 transitionUpdateTime=now();
 if(transitionStartTime<0){
-transitionEventTime=resolveEventTimeStamp();
-transitionEventType=resolveEventType();
+constnewEventTime=resolveEventTimeStamp();
+constnewEventType=resolveEventType();
+transitionEventIsRepeat=
+newEventTime===transitionEventTime&&
+newEventType===transitionEventType;
+transitionEventTime=newEventTime;
+transitionEventType=newEventType;
 }
 }
 }
@@ -76,8 +90,13 @@ export function startAsyncTransitionTimer(): void {
 }
 if(transitionStartTime<0&&transitionUpdateTime<0){
 transitionStartTime=now();
-transitionEventTime=resolveEventTimeStamp();
-transitionEventType=resolveEventType();
+constnewEventTime=resolveEventTimeStamp();
+constnewEventType=resolveEventType();
+transitionEventIsRepeat=
+newEventTime===transitionEventTime&&
+newEventType===transitionEventType;
+transitionEventTime=newEventTime;
+transitionEventType=newEventType;
 }
 }
 
@@ -115,12 +134,7 @@ export function clampBlockingTimers(finalTime: number): void {
 // If we had new updates come in while we were still rendering or committing, we don't want
 // those update times to create overlapping tracks in the performance timeline so we clamp
 // them to the end of the commit phase.
-if(blockingUpdateTime>=0&&blockingUpdateTime<finalTime){
-blockingUpdateTime=finalTime;
-}
-if(blockingEventTime>=0&&blockingEventTime<finalTime){
-blockingEventTime=finalTime;
-}
+blockingClampTime=finalTime;
 }
 
 exportfunctionclampTransitionTimers(finalTime: number): void{
@@ -130,15 +144,7 @@ export function clampTransitionTimers(finalTime: number): void {
 // If we had new updates come in while we were still rendering or committing, we don't want
 // those update times to create overlapping tracks in the performance timeline so we clamp
 // them to the end of the commit phase.
-if(transitionStartTime>=0&&transitionStartTime<finalTime){
-transitionStartTime=finalTime;
-}
-if(transitionUpdateTime>=0&&transitionUpdateTime<finalTime){
-transitionUpdateTime=finalTime;
-}
-if(transitionEventTime>=0&&transitionEventTime<finalTime){
-transitionEventTime=finalTime;
-}
+transitionClampTime=finalTime;
 }
 
 exportfunctionpushNestedEffectDurations(): number{

packages/react-reconciler/src/__tests__/ReactFiberHostContext-test.internal.js

@@ -83,6 +83,7 @@ describe('ReactFiberHostContext', () => {
 }
 returnDefaultEventPriority;
 },
+trackSchedulerEvent: function(){},
 resolveEventType: function(){
 returnnull;
 },

packages/react-art/src/ReactFiberConfigART.js

@@ -363,6 +363,8 @@ export function resolveUpdatePriority(): EventPriority {
 returncurrentUpdatePriority||DefaultEventPriority;
 }
 
+exportfunctiontrackSchedulerEvent(): void{}
+
 export functionresolveEventType(): null|string{
 returnnull;
 }

packages/react-dom-bindings/src/client/ReactFiberConfigDOM.js

@@ -606,14 +606,19 @@ export function shouldAttemptEagerTransition(): boolean {
 returnfalse;
 }
 
+letschedulerEvent: void|Event=undefined;
+exportfunctiontrackSchedulerEvent(): void{
+schedulerEvent=window.event;
+}
+
 export functionresolveEventType(): null|string{
 constevent=window.event;
-returnevent ? event.type : null;
+returnevent&&event!==schedulerEvent? event.type : null;
 }
 
 exportfunctionresolveEventTimeStamp(): number{
 constevent=window.event;
-returnevent ? event.timeStamp : -1.1;
+returnevent&&event!==schedulerEvent? event.timeStamp : -1.1;
 }
 
 exportconstisPrimaryRenderer=true;

packages/react-native-renderer/src/ReactFiberConfigFabric.js

@@ -372,6 +372,8 @@ export function resolveUpdatePriority(): EventPriority {
 returnDefaultEventPriority;
 }
 
+exportfunctiontrackSchedulerEvent(): void{}
+
 export functionresolveEventType(): null|string{
 returnnull;
 }

packages/react-native-renderer/src/ReactFiberConfigNative.js

@@ -288,6 +288,8 @@ export function resolveUpdatePriority(): EventPriority {
 returnDefaultEventPriority;
 }
 
+exportfunctiontrackSchedulerEvent(): void{}
+
 export functionresolveEventType(): null|string{
 returnnull;
 }

packages/react-noop-renderer/src/createReactNoop.js

@@ -531,6 +531,8 @@ function createReactNoop(reconciler: Function, useMutation: boolean) {
 returncurrentEventPriority;
 },
 
+trackSchedulerEvent(): void{},
+
 resolveEventType(): null|string{
  return null;
 },

packages/react-reconciler/src/ReactFiberPerformanceTrack.js

@@ -118,6 +118,7 @@ export function logBlockingStart(
 updateTime: number,
 eventTime: number,
 eventType: null|string,
+eventIsRepeat: boolean,
 renderStartTime: number,
 ): void{
 if(supportsUserTiming){
@@ -127,7 +128,7 @@ export function logBlockingStart(
 reusableLaneDevToolDetails.color='secondary-dark';
 reusableLaneOptions.start=eventTime;
 reusableLaneOptions.end=updateTime>0 ? updateTime : renderStartTime;
-performance.measure(eventType,reusableLaneOptions);
+performance.measure(eventIsRepeat ? '' : eventType,reusableLaneOptions);
 }
 if(updateTime>0){
 // Log the time from when we called setState until we started rendering.
@@ -144,6 +145,7 @@ export function logTransitionStart(
 updateTime: number,
 eventTime: number,
 eventType: null|string,
+eventIsRepeat: boolean,
 renderStartTime: number,
 ): void{
 if(supportsUserTiming){
@@ -158,7 +160,7 @@ export function logTransitionStart(
  : updateTime>0
  ? updateTime
  : renderStartTime;
-performance.measure(eventType,reusableLaneOptions);
+performance.measure(eventIsRepeat ? '' : eventType,reusableLaneOptions);
 }
 if(startTime>0){
 // Log the time from when we started an async transition until we called setState or started rendering.

packages/react-reconciler/src/ReactFiberRootScheduler.js

@@ -18,6 +18,7 @@ import {
 disableSchedulerTimeoutInWorkLoop,
 enableProfilerTimer,
 enableProfilerNestedUpdatePhase,
+enableComponentPerformanceTrack,
 enableSiblingPrerendering,
 }from'shared/ReactFeatureFlags';
 import{
@@ -64,6 +65,7 @@ import {
 supportsMicrotasks,
 scheduleMicrotask,
 shouldAttemptEagerTransition,
+trackSchedulerEvent,
 }from'./ReactFiberConfig';
 
 importReactSharedInternalsfrom'shared/ReactSharedInternals';
@@ -225,6 +227,12 @@ function flushSyncWorkAcrossRoots_impl(
 }
 
 functionprocessRootScheduleInMicrotask(){
+if(enableProfilerTimer&&enableComponentPerformanceTrack){
+// Track the currently executing event if there is one so we can ignore this
+// event when logging events.
+trackSchedulerEvent();
+}
+
 // This function is always called inside a microtask. It should never be
 // called synchronously.
 didScheduleMicrotask=false;
@@ -428,6 +436,12 @@ function performWorkOnRootViaSchedulerTask(
 resetNestedUpdateFlag();
 }
 
+if(enableProfilerTimer&&enableComponentPerformanceTrack){
+// Track the currently executing event if there is one so we can ignore this
+// event when logging events.
+trackSchedulerEvent();
+}
+
 // Flush any pending passive effects before deciding which lanes to work on,
 // in case they schedule additional work.
 constoriginalCallbackNode=root.callbackNode;

packages/react-reconciler/src/ReactFiberWorkLoop.js

@@ -90,6 +90,7 @@ import {
 setCurrentUpdatePriority,
 getCurrentUpdatePriority,
 resolveUpdatePriority,
+trackSchedulerEvent,
 }from'./ReactFiberConfig';
 
 import{createWorkInProgress,resetWorkInProgress}from'./ReactFiber';
@@ -229,13 +230,17 @@ import {
 }from'./ReactFiberConcurrentUpdates';
 
 import{
+blockingClampTime,
 blockingUpdateTime,
 blockingEventTime,
 blockingEventType,
+blockingEventIsRepeat,
+transitionClampTime,
 transitionStartTime,
 transitionUpdateTime,
 transitionEventTime,
 transitionEventType,
+transitionEventIsRepeat,
 clearBlockingTimers,
 clearTransitionTimers,
 clampBlockingTimers,
@@ -938,6 +943,9 @@ export function performWorkOnRoot(
 }
 break;
 }elseif(exitStatus===RootDidNotComplete){
+if(enableProfilerTimer&&enableComponentPerformanceTrack){
+finalizeRender(lanes,now());
+}
 // The render unwound without completing the tree. This happens in special
 // cases where need to exit the current render without producing a
 // consistent tree or committing.
@@ -1130,6 +1138,9 @@ function finishConcurrentRender(
 // This is a transition, so we should exit without committing a
 // placeholder and without scheduling a timeout. Delay indefinitely
 // until we receive more data.
+if(enableProfilerTimer&&enableComponentPerformanceTrack){
+finalizeRender(lanes,now());
+}
 constdidAttemptEntireTree=
 !workInProgressRootDidSkipSuspendedSiblings;
 markRootSuspended(
@@ -1655,19 +1666,31 @@ function prepareFreshStack(root: FiberRoot, lanes: Lanes): Fiber {
 
 if(includesSyncLane(lanes)||includesBlockingLane(lanes)){
 logBlockingStart(
-blockingUpdateTime,
-blockingEventTime,
+blockingUpdateTime>=0&&blockingUpdateTime<blockingClampTime
+ ? blockingClampTime
+ : blockingUpdateTime,
+blockingEventTime>=0&&blockingEventTime<blockingClampTime
+ ? blockingClampTime
+ : blockingEventTime,
 blockingEventType,
+blockingEventIsRepeat,
 renderStartTime,
 );
 clearBlockingTimers();
 }
 if(includesTransitionLane(lanes)){
 logTransitionStart(
-transitionStartTime,
-transitionUpdateTime,
-transitionEventTime,
+transitionStartTime>=0&&transitionStartTime<transitionClampTime
+ ? transitionClampTime
+ : transitionStartTime,
+transitionUpdateTime>=0&&transitionUpdateTime<transitionClampTime
+ ? transitionClampTime
+ : transitionUpdateTime,
+transitionEventTime>=0&&transitionEventTime<transitionClampTime
+ ? transitionClampTime
+ : transitionEventTime,
 transitionEventType,
+transitionEventIsRepeat,
 renderStartTime,
 );
 clearTransitionTimers();
@@ -3139,6 +3162,11 @@ function commitRootImpl(
 // with setTimeout
 pendingPassiveTransitions=transitions;
 scheduleCallback(NormalSchedulerPriority,()=>{
+if(enableProfilerTimer&&enableComponentPerformanceTrack){
+// Track the currently executing event if there is one so we can ignore this
+// event when logging events.
+trackSchedulerEvent();
+}
 flushPassiveEffects(true);
 // This render triggered passive effects: release the root cache pool
 // *after* passive effects fire to avoid freeing a cache pool that may

packages/react-reconciler/src/ReactProfilerTimer.js

@@ -36,14 +36,18 @@ export let componentEffectDuration: number = -0;
 exportletcomponentEffectStartTime: number=-1.1;
 exportletcomponentEffectEndTime: number=-1.1;
 
+exportletblockingClampTime: number=-0;
 exportletblockingUpdateTime: number=-1.1;// First sync setState scheduled.
 exportletblockingEventTime: number=-1.1;// Event timeStamp of the first setState.
 export letblockingEventType: null|string=null;// Event type of the first setState.
+exportletblockingEventIsRepeat: boolean=false;
 // TODO: This should really be one per Transition lane.
+exportlettransitionClampTime: number=-0;
 exportlettransitionStartTime: number=-1.1;// First startTransition call before setState.
 exportlettransitionUpdateTime: number=-1.1;// First transition setState scheduled.
 exportlettransitionEventTime: number=-1.1;// Event timeStamp of the first transition.
 export lettransitionEventType: null|string=null;// Event type of the first transition.
+exportlettransitionEventIsRepeat: boolean=false;
 
 exportfunctionstartUpdateTimerByLane(lane: Lane): void{
 if(!enableProfilerTimer||!enableComponentPerformanceTrack){
@@ -52,15 +56,25 @@ export function startUpdateTimerByLane(lane: Lane): void {
 if(isSyncLane(lane)||isBlockingLane(lane)){
 if(blockingUpdateTime<0){
 blockingUpdateTime=now();
-blockingEventTime=resolveEventTimeStamp();
-blockingEventType=resolveEventType();
+constnewEventTime=resolveEventTimeStamp();
+constnewEventType=resolveEventType();
+blockingEventIsRepeat=
+newEventTime===blockingEventTime&&
+newEventType===blockingEventType;
+blockingEventTime=newEventTime;
+blockingEventType=newEventType;
 }
 }elseif(isTransitionLane(lane)){
 if(transitionUpdateTime<0){
 transitionUpdateTime=now();
 if(transitionStartTime<0){
-transitionEventTime=resolveEventTimeStamp();
-transitionEventType=resolveEventType();
+constnewEventTime=resolveEventTimeStamp();
+constnewEventType=resolveEventType();
+transitionEventIsRepeat=
+newEventTime===transitionEventTime&&
+newEventType===transitionEventType;
+transitionEventTime=newEventTime;
+transitionEventType=newEventType;
 }
 }
 }
@@ -76,8 +90,13 @@ export function startAsyncTransitionTimer(): void {
 }
 if(transitionStartTime<0&&transitionUpdateTime<0){
 transitionStartTime=now();
-transitionEventTime=resolveEventTimeStamp();
-transitionEventType=resolveEventType();
+constnewEventTime=resolveEventTimeStamp();
+constnewEventType=resolveEventType();
+transitionEventIsRepeat=
+newEventTime===transitionEventTime&&
+newEventType===transitionEventType;
+transitionEventTime=newEventTime;
+transitionEventType=newEventType;
 }
 }
 
@@ -115,12 +134,7 @@ export function clampBlockingTimers(finalTime: number): void {
 // If we had new updates come in while we were still rendering or committing, we don't want
 // those update times to create overlapping tracks in the performance timeline so we clamp
 // them to the end of the commit phase.
-if(blockingUpdateTime>=0&&blockingUpdateTime<finalTime){
-blockingUpdateTime=finalTime;
-}
-if(blockingEventTime>=0&&blockingEventTime<finalTime){
-blockingEventTime=finalTime;
-}
+blockingClampTime=finalTime;
 }
 
 exportfunctionclampTransitionTimers(finalTime: number): void{
@@ -130,15 +144,7 @@ export function clampTransitionTimers(finalTime: number): void {
 // If we had new updates come in while we were still rendering or committing, we don't want
 // those update times to create overlapping tracks in the performance timeline so we clamp
 // them to the end of the commit phase.
-if(transitionStartTime>=0&&transitionStartTime<finalTime){
-transitionStartTime=finalTime;
-}
-if(transitionUpdateTime>=0&&transitionUpdateTime<finalTime){
-transitionUpdateTime=finalTime;
-}
-if(transitionEventTime>=0&&transitionEventTime<finalTime){
-transitionEventTime=finalTime;
-}
+transitionClampTime=finalTime;
 }
 
 exportfunctionpushNestedEffectDurations(): number{

packages/react-reconciler/src/__tests__/ReactFiberHostContext-test.internal.js

@@ -83,6 +83,7 @@ describe('ReactFiberHostContext', () => {
 }
 returnDefaultEventPriority;
 },
+trackSchedulerEvent: function(){},
 resolveEventType: function(){
 returnnull;
 },

packages/react-art/src/ReactFiberConfigART.js

@@ -363,6 +363,8 @@ export function resolveUpdatePriority(): EventPriority {
 returncurrentUpdatePriority||DefaultEventPriority;
 }
 
+exportfunctiontrackSchedulerEvent(): void{}
+
 export functionresolveEventType(): null|string{
 returnnull;
 }

packages/react-dom-bindings/src/client/ReactFiberConfigDOM.js

@@ -606,14 +606,19 @@ export function shouldAttemptEagerTransition(): boolean {
 returnfalse;
 }
 
+letschedulerEvent: void|Event=undefined;
+exportfunctiontrackSchedulerEvent(): void{
+schedulerEvent=window.event;
+}
+
 export functionresolveEventType(): null|string{
 constevent=window.event;
-returnevent ? event.type : null;
+returnevent&&event!==schedulerEvent? event.type : null;
 }
 
 exportfunctionresolveEventTimeStamp(): number{
 constevent=window.event;
-returnevent ? event.timeStamp : -1.1;
+returnevent&&event!==schedulerEvent? event.timeStamp : -1.1;
 }
 
 exportconstisPrimaryRenderer=true;

packages/react-native-renderer/src/ReactFiberConfigFabric.js

@@ -372,6 +372,8 @@ export function resolveUpdatePriority(): EventPriority {
 returnDefaultEventPriority;
 }
 
+exportfunctiontrackSchedulerEvent(): void{}
+
 export functionresolveEventType(): null|string{
 returnnull;
 }

packages/react-native-renderer/src/ReactFiberConfigNative.js

@@ -288,6 +288,8 @@ export function resolveUpdatePriority(): EventPriority {
 returnDefaultEventPriority;
 }
 
+exportfunctiontrackSchedulerEvent(): void{}
+
 export functionresolveEventType(): null|string{
 returnnull;
 }

packages/react-noop-renderer/src/createReactNoop.js

@@ -531,6 +531,8 @@ function createReactNoop(reconciler: Function, useMutation: boolean) {
 returncurrentEventPriority;
 },
 
+trackSchedulerEvent(): void{},
+
 resolveEventType(): null|string{
  return null;
 },

packages/react-reconciler/src/ReactFiberPerformanceTrack.js

@@ -118,6 +118,7 @@ export function logBlockingStart(
 updateTime: number,
 eventTime: number,
 eventType: null|string,
+eventIsRepeat: boolean,
 renderStartTime: number,
 ): void{
 if(supportsUserTiming){
@@ -127,7 +128,7 @@ export function logBlockingStart(
 reusableLaneDevToolDetails.color='secondary-dark';
 reusableLaneOptions.start=eventTime;
 reusableLaneOptions.end=updateTime>0 ? updateTime : renderStartTime;
-performance.measure(eventType,reusableLaneOptions);
+performance.measure(eventIsRepeat ? '' : eventType,reusableLaneOptions);
 }
 if(updateTime>0){
 // Log the time from when we called setState until we started rendering.
@@ -144,6 +145,7 @@ export function logTransitionStart(
 updateTime: number,
 eventTime: number,
 eventType: null|string,
+eventIsRepeat: boolean,
 renderStartTime: number,
 ): void{
 if(supportsUserTiming){
@@ -158,7 +160,7 @@ export function logTransitionStart(
  : updateTime>0
  ? updateTime
  : renderStartTime;
-performance.measure(eventType,reusableLaneOptions);
+performance.measure(eventIsRepeat ? '' : eventType,reusableLaneOptions);
 }
 if(startTime>0){
 // Log the time from when we started an async transition until we called setState or started rendering.

packages/react-reconciler/src/ReactFiberRootScheduler.js

@@ -18,6 +18,7 @@ import {
 disableSchedulerTimeoutInWorkLoop,
 enableProfilerTimer,
 enableProfilerNestedUpdatePhase,
+enableComponentPerformanceTrack,
 enableSiblingPrerendering,
 }from'shared/ReactFeatureFlags';
 import{
@@ -64,6 +65,7 @@ import {
 supportsMicrotasks,
 scheduleMicrotask,
 shouldAttemptEagerTransition,
+trackSchedulerEvent,
 }from'./ReactFiberConfig';
 
 importReactSharedInternalsfrom'shared/ReactSharedInternals';
@@ -225,6 +227,12 @@ function flushSyncWorkAcrossRoots_impl(
 }
 
 functionprocessRootScheduleInMicrotask(){
+if(enableProfilerTimer&&enableComponentPerformanceTrack){
+// Track the currently executing event if there is one so we can ignore this
+// event when logging events.
+trackSchedulerEvent();
+}
+
 // This function is always called inside a microtask. It should never be
 // called synchronously.
 didScheduleMicrotask=false;
@@ -428,6 +436,12 @@ function performWorkOnRootViaSchedulerTask(
 resetNestedUpdateFlag();
 }
 
+if(enableProfilerTimer&&enableComponentPerformanceTrack){
+// Track the currently executing event if there is one so we can ignore this
+// event when logging events.
+trackSchedulerEvent();
+}
+
 // Flush any pending passive effects before deciding which lanes to work on,
 // in case they schedule additional work.
 constoriginalCallbackNode=root.callbackNode;

packages/react-reconciler/src/ReactFiberWorkLoop.js

@@ -90,6 +90,7 @@ import {
 setCurrentUpdatePriority,
 getCurrentUpdatePriority,
 resolveUpdatePriority,
+trackSchedulerEvent,
 }from'./ReactFiberConfig';
 
 import{createWorkInProgress,resetWorkInProgress}from'./ReactFiber';
@@ -229,13 +230,17 @@ import {
 }from'./ReactFiberConcurrentUpdates';
 
 import{
+blockingClampTime,
 blockingUpdateTime,
 blockingEventTime,
 blockingEventType,
+blockingEventIsRepeat,
+transitionClampTime,
 transitionStartTime,
 transitionUpdateTime,
 transitionEventTime,
 transitionEventType,
+transitionEventIsRepeat,
 clearBlockingTimers,
 clearTransitionTimers,
 clampBlockingTimers,
@@ -938,6 +943,9 @@ export function performWorkOnRoot(
 }
 break;
 }elseif(exitStatus===RootDidNotComplete){
+if(enableProfilerTimer&&enableComponentPerformanceTrack){
+finalizeRender(lanes,now());
+}
 // The render unwound without completing the tree. This happens in special
 // cases where need to exit the current render without producing a
 // consistent tree or committing.
@@ -1130,6 +1138,9 @@ function finishConcurrentRender(
 // This is a transition, so we should exit without committing a
 // placeholder and without scheduling a timeout. Delay indefinitely
 // until we receive more data.
+if(enableProfilerTimer&&enableComponentPerformanceTrack){
+finalizeRender(lanes,now());
+}
 constdidAttemptEntireTree=
 !workInProgressRootDidSkipSuspendedSiblings;
 markRootSuspended(
@@ -1655,19 +1666,31 @@ function prepareFreshStack(root: FiberRoot, lanes: Lanes): Fiber {
 
 if(includesSyncLane(lanes)||includesBlockingLane(lanes)){
 logBlockingStart(
-blockingUpdateTime,
-blockingEventTime,
+blockingUpdateTime>=0&&blockingUpdateTime<blockingClampTime
+ ? blockingClampTime
+ : blockingUpdateTime,
+blockingEventTime>=0&&blockingEventTime<blockingClampTime
+ ? blockingClampTime
+ : blockingEventTime,
 blockingEventType,
+blockingEventIsRepeat,
 renderStartTime,
 );
 clearBlockingTimers();
 }
 if(includesTransitionLane(lanes)){
 logTransitionStart(
-transitionStartTime,
-transitionUpdateTime,
-transitionEventTime,
+transitionStartTime>=0&&transitionStartTime<transitionClampTime
+ ? transitionClampTime
+ : transitionStartTime,
+transitionUpdateTime>=0&&transitionUpdateTime<transitionClampTime
+ ? transitionClampTime
+ : transitionUpdateTime,
+transitionEventTime>=0&&transitionEventTime<transitionClampTime
+ ? transitionClampTime
+ : transitionEventTime,
 transitionEventType,
+transitionEventIsRepeat,
 renderStartTime,
 );
 clearTransitionTimers();
@@ -3139,6 +3162,11 @@ function commitRootImpl(
 // with setTimeout
 pendingPassiveTransitions=transitions;
 scheduleCallback(NormalSchedulerPriority,()=>{
+if(enableProfilerTimer&&enableComponentPerformanceTrack){
+// Track the currently executing event if there is one so we can ignore this
+// event when logging events.
+trackSchedulerEvent();
+}
 flushPassiveEffects(true);
 // This render triggered passive effects: release the root cache pool
 // *after* passive effects fire to avoid freeing a cache pool that may

packages/react-reconciler/src/ReactProfilerTimer.js

@@ -36,14 +36,18 @@ export let componentEffectDuration: number = -0;
 exportletcomponentEffectStartTime: number=-1.1;
 exportletcomponentEffectEndTime: number=-1.1;
 
+exportletblockingClampTime: number=-0;
 exportletblockingUpdateTime: number=-1.1;// First sync setState scheduled.
 exportletblockingEventTime: number=-1.1;// Event timeStamp of the first setState.
 export letblockingEventType: null|string=null;// Event type of the first setState.
+exportletblockingEventIsRepeat: boolean=false;
 // TODO: This should really be one per Transition lane.
+exportlettransitionClampTime: number=-0;
 exportlettransitionStartTime: number=-1.1;// First startTransition call before setState.
 exportlettransitionUpdateTime: number=-1.1;// First transition setState scheduled.
 exportlettransitionEventTime: number=-1.1;// Event timeStamp of the first transition.
 export lettransitionEventType: null|string=null;// Event type of the first transition.
+exportlettransitionEventIsRepeat: boolean=false;
 
 exportfunctionstartUpdateTimerByLane(lane: Lane): void{
 if(!enableProfilerTimer||!enableComponentPerformanceTrack){
@@ -52,15 +56,25 @@ export function startUpdateTimerByLane(lane: Lane): void {
 if(isSyncLane(lane)||isBlockingLane(lane)){
 if(blockingUpdateTime<0){
 blockingUpdateTime=now();
-blockingEventTime=resolveEventTimeStamp();
-blockingEventType=resolveEventType();
+constnewEventTime=resolveEventTimeStamp();
+constnewEventType=resolveEventType();
+blockingEventIsRepeat=
+newEventTime===blockingEventTime&&
+newEventType===blockingEventType;
+blockingEventTime=newEventTime;
+blockingEventType=newEventType;
 }
 }elseif(isTransitionLane(lane)){
 if(transitionUpdateTime<0){
 transitionUpdateTime=now();
 if(transitionStartTime<0){
-transitionEventTime=resolveEventTimeStamp();
-transitionEventType=resolveEventType();
+constnewEventTime=resolveEventTimeStamp();
+constnewEventType=resolveEventType();
+transitionEventIsRepeat=
+newEventTime===transitionEventTime&&
+newEventType===transitionEventType;
+transitionEventTime=newEventTime;
+transitionEventType=newEventType;
 }
 }
 }
@@ -76,8 +90,13 @@ export function startAsyncTransitionTimer(): void {
 }
 if(transitionStartTime<0&&transitionUpdateTime<0){
 transitionStartTime=now();
-transitionEventTime=resolveEventTimeStamp();
-transitionEventType=resolveEventType();
+constnewEventTime=resolveEventTimeStamp();
+constnewEventType=resolveEventType();
+transitionEventIsRepeat=
+newEventTime===transitionEventTime&&
+newEventType===transitionEventType;
+transitionEventTime=newEventTime;
+transitionEventType=newEventType;
 }
 }
 
@@ -115,12 +134,7 @@ export function clampBlockingTimers(finalTime: number): void {
 // If we had new updates come in while we were still rendering or committing, we don't want
 // those update times to create overlapping tracks in the performance timeline so we clamp
 // them to the end of the commit phase.
-if(blockingUpdateTime>=0&&blockingUpdateTime<finalTime){
-blockingUpdateTime=finalTime;
-}
-if(blockingEventTime>=0&&blockingEventTime<finalTime){
-blockingEventTime=finalTime;
-}
+blockingClampTime=finalTime;
 }
 
 exportfunctionclampTransitionTimers(finalTime: number): void{
@@ -130,15 +144,7 @@ export function clampTransitionTimers(finalTime: number): void {
 // If we had new updates come in while we were still rendering or committing, we don't want
 // those update times to create overlapping tracks in the performance timeline so we clamp
 // them to the end of the commit phase.
-if(transitionStartTime>=0&&transitionStartTime<finalTime){
-transitionStartTime=finalTime;
-}
-if(transitionUpdateTime>=0&&transitionUpdateTime<finalTime){
-transitionUpdateTime=finalTime;
-}
-if(transitionEventTime>=0&&transitionEventTime<finalTime){
-transitionEventTime=finalTime;
-}
+transitionClampTime=finalTime;
 }
 
 exportfunctionpushNestedEffectDurations(): number{

packages/react-reconciler/src/__tests__/ReactFiberHostContext-test.internal.js

@@ -83,6 +83,7 @@ describe('ReactFiberHostContext', () => {
 }
 returnDefaultEventPriority;
 },
+trackSchedulerEvent: function(){},
 resolveEventType: function(){
 returnnull;
 },