[Perf Tracks]: Clear potentially large measures

Author: hoxyq

packages/react-reconciler/src/ReactFiberPerformanceTrack.js

@@ -200,7 +200,7 @@ const reusableComponentOptions: PerformanceMeasureOptions = {
   },
 };
 
-const resuableChangedPropsEntry = ['Changed Props', ''];
+const reusableChangedPropsEntry = ['Changed Props', ''];
 
 const DEEP_EQUALITY_WARNING =
   'This component received deeply equal props. It might benefit from useMemo or the React Compiler in its owner.';
@@ -261,7 +261,7 @@ export function logComponentRender(
         alternate.memoizedProps !== props
       ) {
         // If this is an update, we'll diff the props and emit which ones changed.
-        const properties: Array<[string, string]> = [resuableChangedPropsEntry];
+        const properties: Array<[string, string]> = [reusableChangedPropsEntry];
         const isDeeplyEqual = addObjectDiffToProperties(
           alternate.memoizedProps,
           props,
@@ -293,18 +293,20 @@ export function logComponentRender(
           reusableComponentOptions.start = startTime;
           reusableComponentOptions.end = endTime;
 
+          const measureName = '\u200b' + name;
           if (debugTask != null) {
             debugTask.run(
               // $FlowFixMe[method-unbinding]
               performance.measure.bind(
                 performance,
-                '\u200b' + name,
+                measureName,
                 reusableComponentOptions,
               ),
             );
           } else {
-            performance.measure('\u200b' + name, reusableComponentOptions);
+            performance.measure(measureName, reusableComponentOptions);
           }
+          performance.clearMeasures(measureName);
         }
       } else {
         if (debugTask != null) {
@@ -397,14 +399,17 @@ export function logComponentErrored(
           },
         },
       };
+
+      const measureName = '\u200b' + name;
       if (__DEV__ && debugTask) {
         debugTask.run(
           // $FlowFixMe[method-unbinding]
-          performance.measure.bind(performance, '\u200b' + name, options),
+          performance.measure.bind(performance, measureName, options),
         );
       } else {
-        performance.measure('\u200b' + name, options);
+        performance.measure(measureName, options);
       }
+      performance.clearMeasures(measureName);
     } else {
       console.timeStamp(
         name,
@@ -464,14 +469,16 @@ function logComponentEffectErrored(
         },
       };
       const debugTask = fiber._debugTask;
+      const measureName = '\u200b' + name;
       if (debugTask) {
         debugTask.run(
           // $FlowFixMe[method-unbinding]
-          performance.measure.bind(performance, '\u200b' + name, options),
+          performance.measure.bind(performance, measureName, options),
         );
       } else {
-        performance.measure('\u200b' + name, options);
+        performance.measure(measureName, options);
       }
+      performance.clearMeasures(measureName);
     } else {
       console.timeStamp(
         name,