Work around Chrome DevTools crash on `performance.measure` (#33997)
Sebastian "Sebbie" Silbermann committed
Jul 25, 2025 at 12:32 UTC
7ca2d4cd2e263f1923d958b16797d20d3efbc194
3 files changed
+12
-12
packages/react-client/src/ReactFlightPerformanceTrack.js
+6
-6
@@ -110,7 +110,7 @@ export function logComponentRender(
110
}
111
debugTask.run(
112
// $FlowFixMe[method-unbinding]
113
- performance.measure.bind(performance, entryName, {
113
+ performance.measure.bind(performance, '\u200b' + entryName, {
114
start: startTime < 0 ? 0 : startTime,
115
end: childrenEndTime,
116
detail: {
@@ -125,7 +125,7 @@ export function logComponentRender(
125
);
126
} else {
127
console.timeStamp(
128
- entryName,
128
+ '\u200b' + entryName,
129
startTime < 0 ? 0 : startTime,
130
childrenEndTime,
131
trackNames[trackIdx],
@@ -163,7 +163,7 @@ export function logComponentAborted(
163
if (componentInfo.props != null) {
164
addObjectToProperties(componentInfo.props, properties, 0, '');
165
}
166
- performance.measure(entryName, {
166
+ performance.measure('\u200b' + entryName, {
167
start: startTime < 0 ? 0 : startTime,
168
end: childrenEndTime,
169
detail: {
@@ -220,7 +220,7 @@ export function logComponentErrored(
220
if (componentInfo.props != null) {
221
addObjectToProperties(componentInfo.props, properties, 0, '');
222
}
223
- performance.measure(entryName, {
223
+ performance.measure('\u200b' + entryName, {
224
start: startTime < 0 ? 0 : startTime,
225
end: childrenEndTime,
226
detail: {
@@ -614,7 +614,7 @@ export function logIOInfoErrored(
614
getIOLongName(ioInfo, description, ioInfo.env, rootEnv) + ' Rejected';
615
debugTask.run(
616
// $FlowFixMe[method-unbinding]
617
- performance.measure.bind(performance, entryName, {
617
+ performance.measure.bind(performance, '\u200b' + entryName, {
618
start: startTime < 0 ? 0 : startTime,
619
end: endTime,
620
detail: {
@@ -667,7 +667,7 @@ export function logIOInfo(
667
);
668
debugTask.run(
669
// $FlowFixMe[method-unbinding]
670
- performance.measure.bind(performance, entryName, {
670
+ performance.measure.bind(performance, '\u200b' + entryName, {
671
start: startTime < 0 ? 0 : startTime,
672
end: endTime,
673
detail: {
packages/react-reconciler/src/ReactFiberPerformanceTrack.js
+5
-5
@@ -272,7 +272,7 @@ export function logComponentRender(
272
// $FlowFixMe[method-unbinding]
273
performance.measure.bind(
274
performance,
275
- name,
275
+ '\u200b' + name,
276
reusableComponentOptions,
277
),
278
);
@@ -369,10 +369,10 @@ export function logComponentErrored(
369
if (__DEV__ && debugTask) {
370
debugTask.run(
371
// $FlowFixMe[method-unbinding]
372
- performance.measure.bind(performance, name, options),
372
+ performance.measure.bind(performance, '\u200b' + name, options),
373
);
374
} else {
375
- performance.measure(name, options);
375
+ performance.measure('\u200b' + name, options);
376
}
377
} else {
378
console.timeStamp(
@@ -436,10 +436,10 @@ function logComponentEffectErrored(
436
if (debugTask) {
437
debugTask.run(
438
// $FlowFixMe[method-unbinding]
439
- performance.measure.bind(performance, name, options),
439
+ performance.measure.bind(performance, '\u200b' + name, options),
440
);
441
} else {
442
- performance.measure(name, options);
442
+ performance.measure('\u200b' + name, options);
443
}
444
} else {
445
console.timeStamp(
packages/react-server/src/__tests__/ReactFlightAsyncDebugInfo-test.js
+1
-1
@@ -610,7 +610,7 @@ describe('ReactFlightAsyncDebugInfo', () => {
610
expect(entries).toMatchInlineSnapshot(`
611
[
612
{
613
- "name": "Component",
613
+ "name": "\u200bComponent",
614
},
615
{
616
"name": "await getData (…/pulls)",