Remove "Waiting for async callback" User Timing measurement (#16379)
* Remove "Waiting for async callback" User Timing measurement * Fix User Timing in PROD mode
Dan Abramov committed
Aug 13, 2019 at 22:03 UTC
1fd3906e92ea231848c5b50a99303d4ac3dc7977
4 files changed
+44
-117
packages/react-reconciler/src/ReactFiber.js
+9
-7
@@ -31,6 +31,7 @@ import warningWithoutStack from 'shared/warningWithoutStack';
31
import {
32
enableProfilerTimer,
33
enableFundamentalAPI,
34
+ enableUserTimingAPI,
35
} from 'shared/ReactFeatureFlags';
36
import {NoEffect, Placement} from 'shared/ReactSideEffectTags';
37
import {ConcurrentRoot, BatchedRoot} from 'shared/ReactRootTags';
@@ -245,11 +246,7 @@ export type Fiber = {|
246
_debugHookTypes?: Array<HookType> | null,
247
|};
248
248
-let debugCounter;
249
-
250
-if (__DEV__) {
251
- debugCounter = 1;
252
-}
249
+let debugCounter = 1;
250
251
function FiberNode(
252
tag: WorkTag,
@@ -319,11 +316,16 @@ function FiberNode(
316
this.treeBaseDuration = 0;
317
}
318
322
- if (__DEV__) {
319
+ // This is normally DEV-only except www when it adds listeners.
320
+ // TODO: remove the User Timing integration in favor of Root Events.
321
+ if (enableUserTimingAPI) {
322
this._debugID = debugCounter++;
323
+ this._debugIsCurrentlyTiming = false;
324
+ }
325
+
326
+ if (__DEV__) {
327
this._debugSource = null;
328
this._debugOwner = null;
326
- this._debugIsCurrentlyTiming = false;
329
this._debugNeedsRemount = false;
330
this._debugHookTypes = null;
331
if (!hasBadMapPolyfill && typeof Object.preventExtensions === 'function') {
packages/react-reconciler/src/ReactFiberWorkLoop.js
-20
@@ -152,8 +152,6 @@ import {
152
import {
153
recordEffect,
154
recordScheduleUpdate,
155
- startRequestCallbackTimer,
156
- stopRequestCallbackTimer,
155
startWorkTimer,
156
stopWorkTimer,
157
stopFailedWorkTimer,
@@ -546,16 +544,6 @@ function scheduleCallbackForRoot(
544
),
545
options,
546
);
549
- if (
550
- enableUserTimingAPI &&
551
- expirationTime !== Sync &&
552
- (executionContext & (RenderContext | CommitContext)) === NoContext
553
- ) {
554
- // Scheduled an async callback, and we're not already working. Add an
555
- // entry to the flamegraph that shows we're waiting for a callback
556
- // to fire.
557
- startRequestCallbackTimer();
558
- }
547
}
548
}
549
@@ -816,11 +804,6 @@ function renderRoot(
804
'Should not already be working.',
805
);
806
819
- if (enableUserTimingAPI && expirationTime !== Sync) {
820
- const didExpire = isSync;
821
- stopRequestCallbackTimer(didExpire);
822
- }
823
-
807
if (root.firstPendingTime < expirationTime) {
808
// If there's no work left at this expiration time, exit immediately. This
809
// happens when multiple callbacks are scheduled for a single root, but an
@@ -964,9 +947,6 @@ function renderRoot(
947
if (workInProgress !== null) {
948
// There's still work left over. Return a continuation.
949
stopInterruptedWorkLoopTimer();
967
- if (expirationTime !== Sync) {
968
- startRequestCallbackTimer();
969
- }
950
return renderRoot.bind(null, root, expirationTime);
951
}
952
}
packages/react-reconciler/src/__tests__/ReactIncrementalPerf-test.internal.js
+9
@@ -89,6 +89,15 @@ describe('ReactDebugFiberPerf', () => {
89
// We don't use the overload with three arguments.
90
measure(label, markName) {
91
if (markName !== activeMeasure.markName) {
92
+ // Fail the test.
93
+ console.error(
94
+ 'Unexpected measure() call: "%s". Active mark is "%s".',
95
+ markName,
96
+ activeMeasure.markName,
97
+ );
98
+ // This exception will be caught and ignored
99
+ // because in the real implementation, we don't want
100
+ // to spam the console due to a React bug.
101
throw new Error('Unexpected measure() call.');
102
}
103
// Step one level up
packages/react-reconciler/src/__tests__/__snapshots__/ReactIncrementalPerf-test.internal.js.snap
+26
-90
@@ -1,9 +1,7 @@
1
// Jest Snapshot v1, https://goo.gl/fbAQLP
2
3
exports[`ReactDebugFiberPerf captures all lifecycles 1`] = `
4
-"⚛ (Waiting for async callback...)
5
-
6
-// Mount
4
+"// Mount
5
⚛ (React Tree Reconciliation: Completed Root)
6
⚛ AllLifecycles [mount]
7
⚛ AllLifecycles.componentWillMount
@@ -15,8 +13,6 @@ exports[`ReactDebugFiberPerf captures all lifecycles 1`] = `
13
⚛ (Calling Lifecycle Methods: 1 Total)
14
⚛ AllLifecycles.componentDidMount
15
18
-⚛ (Waiting for async callback...)
19
-
16
// Update
17
⚛ (React Tree Reconciliation: Completed Root)
18
⚛ AllLifecycles [update]
@@ -31,8 +27,6 @@ exports[`ReactDebugFiberPerf captures all lifecycles 1`] = `
27
⚛ (Calling Lifecycle Methods: 2 Total)
28
⚛ AllLifecycles.componentDidUpdate
29
34
-⚛ (Waiting for async callback...)
35
-
30
// Unmount
31
⚛ (React Tree Reconciliation: Completed Root)
32
@@ -45,9 +39,7 @@ exports[`ReactDebugFiberPerf captures all lifecycles 1`] = `
39
`;
40
41
exports[`ReactDebugFiberPerf deduplicates lifecycle names during commit to reduce overhead 1`] = `
48
-"⚛ (Waiting for async callback...)
49
-
50
-// The commit phase should mention A and B just once
42
+"// The commit phase should mention A and B just once
43
⚛ (React Tree Reconciliation: Completed Root)
44
⚛ Parent [update]
45
⚛ A [update]
@@ -62,8 +54,6 @@ exports[`ReactDebugFiberPerf deduplicates lifecycle names during commit to reduc
54
⚛ A.componentDidUpdate
55
⚛ B.componentDidUpdate
56
65
-⚛ (Waiting for async callback...)
66
-
57
// Because of deduplication, we don't know B was cascading,
58
// but we should still see the warning for the commit phase.
59
⚛ (React Tree Reconciliation: Completed Root)
@@ -92,9 +82,7 @@ exports[`ReactDebugFiberPerf deduplicates lifecycle names during commit to reduc
82
`;
83
84
exports[`ReactDebugFiberPerf does not include StrictMode or Profiler components in measurements 1`] = `
95
-"⚛ (Waiting for async callback...)
96
-
97
-// Mount
85
+"// Mount
86
⚛ (React Tree Reconciliation: Completed Root)
87
⚛ Profiler [mount]
88
⚛ Parent [mount]
@@ -108,9 +96,7 @@ exports[`ReactDebugFiberPerf does not include StrictMode or Profiler components
96
`;
97
98
exports[`ReactDebugFiberPerf does not include context provider or consumer in measurements 1`] = `
111
-"⚛ (Waiting for async callback...)
112
-
113
-// Mount
99
+"// Mount
100
⚛ (React Tree Reconciliation: Completed Root)
101
⚛ Parent [mount]
102
⚛ Child [mount]
@@ -143,9 +129,7 @@ exports[`ReactDebugFiberPerf does not schedule an extra callback if setState is
129
`;
130
131
exports[`ReactDebugFiberPerf does not treat setState from cWM or cWRP as cascading 1`] = `
146
-"⚛ (Waiting for async callback...)
147
-
148
-// Should not print a warning
132
+"// Should not print a warning
133
⚛ (React Tree Reconciliation: Completed Root)
134
⚛ Parent [mount]
135
⚛ NotCascading [mount]
@@ -156,8 +140,6 @@ exports[`ReactDebugFiberPerf does not treat setState from cWM or cWRP as cascadi
140
⚛ (Committing Host Effects: 1 Total)
141
⚛ (Calling Lifecycle Methods: 0 Total)
142
159
-⚛ (Waiting for async callback...)
160
-
143
// Should not print a warning
144
⚛ (React Tree Reconciliation: Completed Root)
145
⚛ Parent [update]
@@ -172,9 +154,7 @@ exports[`ReactDebugFiberPerf does not treat setState from cWM or cWRP as cascadi
154
`;
155
156
exports[`ReactDebugFiberPerf measures a simple reconciliation 1`] = `
175
-"⚛ (Waiting for async callback...)
176
-
177
-// Mount
157
+"// Mount
158
⚛ (React Tree Reconciliation: Completed Root)
159
⚛ Parent [mount]
160
⚛ Child [mount]
@@ -184,8 +164,6 @@ exports[`ReactDebugFiberPerf measures a simple reconciliation 1`] = `
164
⚛ (Committing Host Effects: 1 Total)
165
⚛ (Calling Lifecycle Methods: 0 Total)
166
187
-⚛ (Waiting for async callback...)
188
-
167
// Update
168
⚛ (React Tree Reconciliation: Completed Root)
169
⚛ Parent [update]
@@ -196,8 +174,6 @@ exports[`ReactDebugFiberPerf measures a simple reconciliation 1`] = `
174
⚛ (Committing Host Effects: 2 Total)
175
⚛ (Calling Lifecycle Methods: 2 Total)
176
199
-⚛ (Waiting for async callback...)
200
-
177
// Unmount
178
⚛ (React Tree Reconciliation: Completed Root)
179
@@ -209,17 +185,13 @@ exports[`ReactDebugFiberPerf measures a simple reconciliation 1`] = `
185
`;
186
187
exports[`ReactDebugFiberPerf measures deferred work in chunks 1`] = `
212
-"⚛ (Waiting for async callback...)
213
-
214
-// Start rendering through B
188
+"// Start rendering through B
189
⚛ (React Tree Reconciliation: Yielded)
190
⚛ Parent [mount]
191
⚛ A [mount]
192
⚛ Child [mount]
193
⚛ B [mount]
194
221
-⚛ (Waiting for async callback...)
222
-
195
// Complete the rest
196
⚛ (React Tree Reconciliation: Completed Root)
197
⚛ Parent [mount]
@@ -245,8 +217,6 @@ exports[`ReactDebugFiberPerf measures deprioritized work 1`] = `
217
⚛ (Committing Host Effects: 1 Total)
218
⚛ (Calling Lifecycle Methods: 0 Total)
219
248
-⚛ (Waiting for async callback...)
249
-
220
// Flush the child
221
⚛ (React Tree Reconciliation: Completed Root)
222
⚛ Child [mount]
@@ -259,9 +229,7 @@ exports[`ReactDebugFiberPerf measures deprioritized work 1`] = `
229
`;
230
231
exports[`ReactDebugFiberPerf properly displays the forwardRef component in measurements 1`] = `
262
-"⚛ (Waiting for async callback...)
263
-
264
-// Mount
232
+"// Mount
233
⚛ (React Tree Reconciliation: Completed Root)
234
⚛ Parent [mount]
235
⚛ ForwardRef [mount]
@@ -279,9 +247,7 @@ exports[`ReactDebugFiberPerf properly displays the forwardRef component in measu
247
`;
248
249
exports[`ReactDebugFiberPerf recovers from caught errors 1`] = `
282
-"⚛ (Waiting for async callback...)
283
-
284
-// Stop on Baddie and restart from Boundary
250
+"// Stop on Baddie and restart from Boundary
251
⚛ (React Tree Reconciliation: Completed Root)
252
⚛ Parent [mount]
253
⛔ Boundary [mount] Warning: An error was thrown inside this error boundary
@@ -313,9 +279,7 @@ exports[`ReactDebugFiberPerf recovers from caught errors 1`] = `
279
`;
280
281
exports[`ReactDebugFiberPerf recovers from fatal errors 1`] = `
316
-"⚛ (Waiting for async callback...)
317
-
318
-// Will fatal
282
+"// Will fatal
283
⚛ (React Tree Reconciliation: Completed Root)
284
⚛ Parent [mount]
285
⚛ Baddie [mount]
@@ -329,8 +293,6 @@ exports[`ReactDebugFiberPerf recovers from fatal errors 1`] = `
293
⚛ (Committing Host Effects: 1 Total)
294
⚛ (Calling Lifecycle Methods: 1 Total)
295
332
-⚛ (Waiting for async callback...)
333
-
296
// Will reconcile from a clean state
297
⚛ (React Tree Reconciliation: Completed Root)
298
⚛ Parent [mount]
@@ -344,9 +306,7 @@ exports[`ReactDebugFiberPerf recovers from fatal errors 1`] = `
306
`;
307
308
exports[`ReactDebugFiberPerf skips parents during setState 1`] = `
347
-"⚛ (Waiting for async callback...)
348
-
349
-// Should include just A and B, no Parents
309
+"// Should include just A and B, no Parents
310
⚛ (React Tree Reconciliation: Completed Root)
311
⚛ A [update]
312
⚛ B [update]
@@ -359,9 +319,7 @@ exports[`ReactDebugFiberPerf skips parents during setState 1`] = `
319
`;
320
321
exports[`ReactDebugFiberPerf supports Suspense and lazy 1`] = `
362
-"⚛ (Waiting for async callback...)
363
-
364
-⚛ (React Tree Reconciliation: Completed Root)
322
+"⚛ (React Tree Reconciliation: Completed Root)
323
⚛ Parent [mount]
324
⚛ Suspense [mount]
325
@@ -373,9 +331,7 @@ exports[`ReactDebugFiberPerf supports Suspense and lazy 1`] = `
331
`;
332
333
exports[`ReactDebugFiberPerf supports Suspense and lazy 2`] = `
376
-"⚛ (Waiting for async callback...)
377
-
378
-⚛ (React Tree Reconciliation: Completed Root)
334
+"⚛ (React Tree Reconciliation: Completed Root)
335
⚛ Parent [mount]
336
⚛ Suspense [mount]
337
@@ -384,8 +340,6 @@ exports[`ReactDebugFiberPerf supports Suspense and lazy 2`] = `
340
⚛ (Committing Host Effects: 1 Total)
341
⚛ (Calling Lifecycle Methods: 0 Total)
342
387
-⚛ (Waiting for async callback...)
388
-
343
⚛ (React Tree Reconciliation: Completed Root)
344
⚛ Parent [update]
345
⛔ Suspense [update] Warning: Rendering was suspended
@@ -395,9 +349,7 @@ exports[`ReactDebugFiberPerf supports Suspense and lazy 2`] = `
349
`;
350
351
exports[`ReactDebugFiberPerf supports Suspense and lazy 3`] = `
398
-"⚛ (Waiting for async callback...)
399
-
400
-⚛ (React Tree Reconciliation: Completed Root)
352
+"⚛ (React Tree Reconciliation: Completed Root)
353
⚛ Parent [mount]
354
⚛ Suspense [mount]
355
@@ -406,16 +358,12 @@ exports[`ReactDebugFiberPerf supports Suspense and lazy 3`] = `
358
⚛ (Committing Host Effects: 1 Total)
359
⚛ (Calling Lifecycle Methods: 0 Total)
360
409
-⚛ (Waiting for async callback...)
410
-
361
⚛ (React Tree Reconciliation: Completed Root)
362
⚛ Parent [update]
363
⛔ Suspense [update] Warning: Rendering was suspended
364
⚛ Suspense [update]
365
⚛ Spinner [mount]
366
417
-⚛ (Waiting for async callback...)
418
-
367
⚛ (React Tree Reconciliation: Completed Root)
368
⚛ Parent [update]
369
⚛ Suspense [update]
@@ -429,9 +377,7 @@ exports[`ReactDebugFiberPerf supports Suspense and lazy 3`] = `
377
`;
378
379
exports[`ReactDebugFiberPerf supports memo 1`] = `
432
-"⚛ (Waiting for async callback...)
433
-
434
-⚛ (React Tree Reconciliation: Completed Root)
380
+"⚛ (React Tree Reconciliation: Completed Root)
381
⚛ Parent [mount]
382
⚛ Foo [mount]
383
@@ -443,9 +389,7 @@ exports[`ReactDebugFiberPerf supports memo 1`] = `
389
`;
390
391
exports[`ReactDebugFiberPerf supports portals 1`] = `
446
-"⚛ (Waiting for async callback...)
447
-
448
-⚛ (React Tree Reconciliation: Completed Root)
392
+"⚛ (React Tree Reconciliation: Completed Root)
393
⚛ Parent [mount]
394
⚛ Child [mount]
395
@@ -457,18 +401,16 @@ exports[`ReactDebugFiberPerf supports portals 1`] = `
401
`;
402
403
exports[`ReactDebugFiberPerf warns if an in-progress update is interrupted 1`] = `
460
-"⚛ (Waiting for async callback...)
404
+"⚛ (React Tree Reconciliation: Yielded)
405
+ ⚛ Foo [mount]
406
462
-⚛ (React Tree Reconciliation: Yielded)
407
+⛔ (React Tree Reconciliation: Completed Root) Warning: A top-level update interrupted the previous render
408
⚛ Foo [mount]
409
465
-⚛ (Waiting for async callback...)
466
- ⛔ (React Tree Reconciliation: Completed Root) Warning: A top-level update interrupted the previous render
467
- ⚛ Foo [mount]
468
- ⚛ (Committing Changes)
469
- ⚛ (Committing Snapshot Effects: 0 Total)
470
- ⚛ (Committing Host Effects: 1 Total)
471
- ⚛ (Calling Lifecycle Methods: 0 Total)
410
+⚛ (Committing Changes)
411
+ ⚛ (Committing Snapshot Effects: 0 Total)
412
+ ⚛ (Committing Host Effects: 1 Total)
413
+ ⚛ (Calling Lifecycle Methods: 0 Total)
414
415
⚛ (React Tree Reconciliation: Completed Root)
416
@@ -480,9 +422,7 @@ exports[`ReactDebugFiberPerf warns if an in-progress update is interrupted 1`] =
422
`;
423
424
exports[`ReactDebugFiberPerf warns if async work expires (starvation) 1`] = `
483
-"⛔ (Waiting for async callback...) Warning: Update expired; will flush synchronously
484
-
485
-⚛ (Committing Changes)
425
+"⚛ (Committing Changes)
426
⚛ (Committing Snapshot Effects: 0 Total)
427
⚛ (Committing Host Effects: 1 Total)
428
⚛ (Calling Lifecycle Methods: 0 Total)
@@ -490,9 +430,7 @@ exports[`ReactDebugFiberPerf warns if async work expires (starvation) 1`] = `
430
`;
431
432
exports[`ReactDebugFiberPerf warns on cascading renders from setState 1`] = `
493
-"⚛ (Waiting for async callback...)
494
-
495
-// Should print a warning
433
+"// Should print a warning
434
⚛ (React Tree Reconciliation: Completed Root)
435
⚛ Parent [mount]
436
⚛ Cascading [mount]
@@ -514,9 +452,7 @@ exports[`ReactDebugFiberPerf warns on cascading renders from setState 1`] = `
452
`;
453
454
exports[`ReactDebugFiberPerf warns on cascading renders from top-level render 1`] = `
517
-"⚛ (Waiting for async callback...)
518
-
519
-// Rendering the first root
455
+"// Rendering the first root
456
⚛ (React Tree Reconciliation: Completed Root)
457
⚛ Cascading [mount]
458