@samitouri / QOS-React-2 / commits / 5f71eed2eb

[devtools] fix: check if profiling for all profiling hooks (#33701)

Follow-up to https://github.com/facebook/react/pull/33652. Don't know how the other were missed. Double-checked that Profiler works in dev mode. Now all hooks start with `!isProfiling` check and return, if true.

Ruslan Lesiutin committed Jul 4, 2025 at 16:21 UTC 5f71eed2ebade22ffd374d291b2a21d94c35ffa7
1 file changed +328 -292
packages/react-devtools-shared/src/backend/profilingHooks.js
+328 -292
@@ -298,14 +298,16 @@ export function createProfilingHooks({
298 }
299
300 function markCommitStarted(lanes: Lanes): void {
301 - if (isProfiling) {
302 - recordReactMeasureStarted('commit', lanes);
303 -
304 - // TODO (timeline) Re-think this approach to "batching"; I don't think it works for Suspense or pre-rendering.
305 - // This issue applies to the User Timing data also.
306 - nextRenderShouldStartNewBatch = true;
301 + if (!isProfiling) {
302 + return;
303 }
304
305 + recordReactMeasureStarted('commit', lanes);
306 +
307 + // TODO (timeline) Re-think this approach to "batching"; I don't think it works for Suspense or pre-rendering.
308 + // This issue applies to the User Timing data also.
309 + nextRenderShouldStartNewBatch = true;
310 +
311 if (supportsUserTimingV3) {
312 markAndClear(`--commit-start-${lanes}`);
313
@@ -318,50 +320,55 @@ export function createProfilingHooks({
320 }
321
322 function markCommitStopped(): void {
321 - if (isProfiling) {
322 - recordReactMeasureCompleted('commit');
323 - recordReactMeasureCompleted('render-idle');
323 + if (!isProfiling) {
324 + return;
325 }
326
327 + recordReactMeasureCompleted('commit');
328 + recordReactMeasureCompleted('render-idle');
329 if (supportsUserTimingV3) {
330 markAndClear('--commit-stop');
331 }
332 }
333
334 function markComponentRenderStarted(fiber: Fiber): void {
332 - if (isProfiling) {
333 - const componentName = getDisplayNameForFiber(fiber) || 'Unknown';
335 + if (!isProfiling) {
336 + return;
337 + }
338
335 - // TODO (timeline) Record and cache component stack
336 - currentReactComponentMeasure = {
337 - componentName,
338 - duration: 0,
339 - timestamp: getRelativeTime(),
340 - type: 'render',
341 - warning: null,
342 - };
339 + const componentName = getDisplayNameForFiber(fiber) || 'Unknown';
340
344 - if (supportsUserTimingV3) {
345 - markAndClear(`--component-render-start-${componentName}`);
346 - }
341 + // TODO (timeline) Record and cache component stack
342 + currentReactComponentMeasure = {
343 + componentName,
344 + duration: 0,
345 + timestamp: getRelativeTime(),
346 + type: 'render',
347 + warning: null,
348 + };
349 +
350 + if (supportsUserTimingV3) {
351 + markAndClear(`--component-render-start-${componentName}`);
352 }
353 }
354
355 function markComponentRenderStopped(): void {
351 - if (isProfiling) {
352 - if (currentReactComponentMeasure) {
353 - if (currentTimelineData) {
354 - currentTimelineData.componentMeasures.push(
355 - currentReactComponentMeasure,
356 - );
357 - }
356 + if (!isProfiling) {
357 + return;
358 + }
359
359 - // $FlowFixMe[incompatible-use] found when upgrading Flow
360 - currentReactComponentMeasure.duration =
361 - // $FlowFixMe[incompatible-use] found when upgrading Flow
362 - getRelativeTime() - currentReactComponentMeasure.timestamp;
363 - currentReactComponentMeasure = null;
360 + if (currentReactComponentMeasure) {
361 + if (currentTimelineData) {
362 + currentTimelineData.componentMeasures.push(
363 + currentReactComponentMeasure,
364 + );
365 }
366 +
367 + // $FlowFixMe[incompatible-use] found when upgrading Flow
368 + currentReactComponentMeasure.duration =
369 + // $FlowFixMe[incompatible-use] found when upgrading Flow
370 + getRelativeTime() - currentReactComponentMeasure.timestamp;
371 + currentReactComponentMeasure = null;
372 }
373
374 if (supportsUserTimingV3) {
@@ -370,39 +377,43 @@ export function createProfilingHooks({
377 }
378
379 function markComponentLayoutEffectMountStarted(fiber: Fiber): void {
373 - if (isProfiling) {
374 - const componentName = getDisplayNameForFiber(fiber) || 'Unknown';
380 + if (!isProfiling) {
381 + return;
382 + }
383
376 - // TODO (timeline) Record and cache component stack
377 - currentReactComponentMeasure = {
378 - componentName,
379 - duration: 0,
380 - timestamp: getRelativeTime(),
381 - type: 'layout-effect-mount',
382 - warning: null,
383 - };
384 + const componentName = getDisplayNameForFiber(fiber) || 'Unknown';
385
385 - if (supportsUserTimingV3) {
386 - markAndClear(`--component-layout-effect-mount-start-${componentName}`);
387 - }
386 + // TODO (timeline) Record and cache component stack
387 + currentReactComponentMeasure = {
388 + componentName,
389 + duration: 0,
390 + timestamp: getRelativeTime(),
391 + type: 'layout-effect-mount',
392 + warning: null,
393 + };
394 +
395 + if (supportsUserTimingV3) {
396 + markAndClear(`--component-layout-effect-mount-start-${componentName}`);
397 }
398 }
399
400 function markComponentLayoutEffectMountStopped(): void {
392 - if (isProfiling) {
393 - if (currentReactComponentMeasure) {
394 - if (currentTimelineData) {
395 - currentTimelineData.componentMeasures.push(
396 - currentReactComponentMeasure,
397 - );
398 - }
401 + if (!isProfiling) {
402 + return;
403 + }
404
400 - // $FlowFixMe[incompatible-use] found when upgrading Flow
401 - currentReactComponentMeasure.duration =
402 - // $FlowFixMe[incompatible-use] found when upgrading Flow
403 - getRelativeTime() - currentReactComponentMeasure.timestamp;
404 - currentReactComponentMeasure = null;
405 + if (currentReactComponentMeasure) {
406 + if (currentTimelineData) {
407 + currentTimelineData.componentMeasures.push(
408 + currentReactComponentMeasure,
409 + );
410 }
411 +
412 + // $FlowFixMe[incompatible-use] found when upgrading Flow
413 + currentReactComponentMeasure.duration =
414 + // $FlowFixMe[incompatible-use] found when upgrading Flow
415 + getRelativeTime() - currentReactComponentMeasure.timestamp;
416 + currentReactComponentMeasure = null;
417 }
418
419 if (supportsUserTimingV3) {
@@ -411,41 +422,43 @@ export function createProfilingHooks({
422 }
423
424 function markComponentLayoutEffectUnmountStarted(fiber: Fiber): void {
414 - if (isProfiling) {
415 - const componentName = getDisplayNameForFiber(fiber) || 'Unknown';
425 + if (!isProfiling) {
426 + return;
427 + }
428
417 - // TODO (timeline) Record and cache component stack
418 - currentReactComponentMeasure = {
419 - componentName,
420 - duration: 0,
421 - timestamp: getRelativeTime(),
422 - type: 'layout-effect-unmount',
423 - warning: null,
424 - };
429 + const componentName = getDisplayNameForFiber(fiber) || 'Unknown';
430
426 - if (supportsUserTimingV3) {
427 - markAndClear(
428 - `--component-layout-effect-unmount-start-${componentName}`,
429 - );
430 - }
431 + // TODO (timeline) Record and cache component stack
432 + currentReactComponentMeasure = {
433 + componentName,
434 + duration: 0,
435 + timestamp: getRelativeTime(),
436 + type: 'layout-effect-unmount',
437 + warning: null,
438 + };
439 +
440 + if (supportsUserTimingV3) {
441 + markAndClear(`--component-layout-effect-unmount-start-${componentName}`);
442 }
443 }
444
445 function markComponentLayoutEffectUnmountStopped(): void {
435 - if (isProfiling) {
436 - if (currentReactComponentMeasure) {
437 - if (currentTimelineData) {
438 - currentTimelineData.componentMeasures.push(
439 - currentReactComponentMeasure,
440 - );
441 - }
446 + if (!isProfiling) {
447 + return;
448 + }
449
443 - // $FlowFixMe[incompatible-use] found when upgrading Flow
444 - currentReactComponentMeasure.duration =
445 - // $FlowFixMe[incompatible-use] found when upgrading Flow
446 - getRelativeTime() - currentReactComponentMeasure.timestamp;
447 - currentReactComponentMeasure = null;
450 + if (currentReactComponentMeasure) {
451 + if (currentTimelineData) {
452 + currentTimelineData.componentMeasures.push(
453 + currentReactComponentMeasure,
454 + );
455 }
456 +
457 + // $FlowFixMe[incompatible-use] found when upgrading Flow
458 + currentReactComponentMeasure.duration =
459 + // $FlowFixMe[incompatible-use] found when upgrading Flow
460 + getRelativeTime() - currentReactComponentMeasure.timestamp;
461 + currentReactComponentMeasure = null;
462 }
463
464 if (supportsUserTimingV3) {
@@ -454,39 +467,43 @@ export function createProfilingHooks({
467 }
468
469 function markComponentPassiveEffectMountStarted(fiber: Fiber): void {
457 - if (isProfiling) {
458 - const componentName = getDisplayNameForFiber(fiber) || 'Unknown';
470 + if (!isProfiling) {
471 + return;
472 + }
473
460 - // TODO (timeline) Record and cache component stack
461 - currentReactComponentMeasure = {
462 - componentName,
463 - duration: 0,
464 - timestamp: getRelativeTime(),
465 - type: 'passive-effect-mount',
466 - warning: null,
467 - };
474 + const componentName = getDisplayNameForFiber(fiber) || 'Unknown';
475
469 - if (supportsUserTimingV3) {
470 - markAndClear(`--component-passive-effect-mount-start-${componentName}`);
471 - }
476 + // TODO (timeline) Record and cache component stack
477 + currentReactComponentMeasure = {
478 + componentName,
479 + duration: 0,
480 + timestamp: getRelativeTime(),
481 + type: 'passive-effect-mount',
482 + warning: null,
483 + };
484 +
485 + if (supportsUserTimingV3) {
486 + markAndClear(`--component-passive-effect-mount-start-${componentName}`);
487 }
488 }
489
490 function markComponentPassiveEffectMountStopped(): void {
476 - if (isProfiling) {
477 - if (currentReactComponentMeasure) {
478 - if (currentTimelineData) {
479 - currentTimelineData.componentMeasures.push(
480 - currentReactComponentMeasure,
481 - );
482 - }
491 + if (!isProfiling) {
492 + return;
493 + }
494
484 - // $FlowFixMe[incompatible-use] found when upgrading Flow
485 - currentReactComponentMeasure.duration =
486 - // $FlowFixMe[incompatible-use] found when upgrading Flow
487 - getRelativeTime() - currentReactComponentMeasure.timestamp;
488 - currentReactComponentMeasure = null;
495 + if (currentReactComponentMeasure) {
496 + if (currentTimelineData) {
497 + currentTimelineData.componentMeasures.push(
498 + currentReactComponentMeasure,
499 + );
500 }
501 +
502 + // $FlowFixMe[incompatible-use] found when upgrading Flow
503 + currentReactComponentMeasure.duration =
504 + // $FlowFixMe[incompatible-use] found when upgrading Flow
505 + getRelativeTime() - currentReactComponentMeasure.timestamp;
506 + currentReactComponentMeasure = null;
507 }
508
509 if (supportsUserTimingV3) {
@@ -495,41 +512,43 @@ export function createProfilingHooks({
512 }
513
514 function markComponentPassiveEffectUnmountStarted(fiber: Fiber): void {
498 - if (isProfiling) {
499 - const componentName = getDisplayNameForFiber(fiber) || 'Unknown';
515 + if (!isProfiling) {
516 + return;
517 + }
518
501 - // TODO (timeline) Record and cache component stack
502 - currentReactComponentMeasure = {
503 - componentName,
504 - duration: 0,
505 - timestamp: getRelativeTime(),
506 - type: 'passive-effect-unmount',
507 - warning: null,
508 - };
519 + const componentName = getDisplayNameForFiber(fiber) || 'Unknown';
520
510 - if (supportsUserTimingV3) {
511 - markAndClear(
512 - `--component-passive-effect-unmount-start-${componentName}`,
513 - );
514 - }
521 + // TODO (timeline) Record and cache component stack
522 + currentReactComponentMeasure = {
523 + componentName,
524 + duration: 0,
525 + timestamp: getRelativeTime(),
526 + type: 'passive-effect-unmount',
527 + warning: null,
528 + };
529 +
530 + if (supportsUserTimingV3) {
531 + markAndClear(`--component-passive-effect-unmount-start-${componentName}`);
532 }
533 }
534
535 function markComponentPassiveEffectUnmountStopped(): void {
519 - if (isProfiling) {
520 - if (currentReactComponentMeasure) {
521 - if (currentTimelineData) {
522 - currentTimelineData.componentMeasures.push(
523 - currentReactComponentMeasure,
524 - );
525 - }
536 + if (!isProfiling) {
537 + return;
538 + }
539
527 - // $FlowFixMe[incompatible-use] found when upgrading Flow
528 - currentReactComponentMeasure.duration =
529 - // $FlowFixMe[incompatible-use] found when upgrading Flow
530 - getRelativeTime() - currentReactComponentMeasure.timestamp;
531 - currentReactComponentMeasure = null;
540 + if (currentReactComponentMeasure) {
541 + if (currentTimelineData) {
542 + currentTimelineData.componentMeasures.push(
543 + currentReactComponentMeasure,
544 + );
545 }
546 +
547 + // $FlowFixMe[incompatible-use] found when upgrading Flow
548 + currentReactComponentMeasure.duration =
549 + // $FlowFixMe[incompatible-use] found when upgrading Flow
550 + getRelativeTime() - currentReactComponentMeasure.timestamp;
551 + currentReactComponentMeasure = null;
552 }
553
554 if (supportsUserTimingV3) {
@@ -542,35 +561,37 @@ export function createProfilingHooks({
561 thrownValue: mixed,
562 lanes: Lanes,
563 ): void {
545 - if (isProfiling) {
546 - const componentName = getDisplayNameForFiber(fiber) || 'Unknown';
547 - const phase = fiber.alternate === null ? 'mount' : 'update';
548 -
549 - let message = '';
550 - if (
551 - thrownValue !== null &&
552 - typeof thrownValue === 'object' &&
553 - typeof thrownValue.message === 'string'
554 - ) {
555 - message = thrownValue.message;
556 - } else if (typeof thrownValue === 'string') {
557 - message = thrownValue;
558 - }
564 + if (!isProfiling) {
565 + return;
566 + }
567
560 - // TODO (timeline) Record and cache component stack
561 - if (currentTimelineData) {
562 - currentTimelineData.thrownErrors.push({
563 - componentName,
564 - message,
565 - phase,
566 - timestamp: getRelativeTime(),
567 - type: 'thrown-error',
568 - });
569 - }
568 + const componentName = getDisplayNameForFiber(fiber) || 'Unknown';
569 + const phase = fiber.alternate === null ? 'mount' : 'update';
570
571 - if (supportsUserTimingV3) {
572 - markAndClear(`--error-${componentName}-${phase}-${message}`);
573 - }
571 + let message = '';
572 + if (
573 + thrownValue !== null &&
574 + typeof thrownValue === 'object' &&
575 + typeof thrownValue.message === 'string'
576 + ) {
577 + message = thrownValue.message;
578 + } else if (typeof thrownValue === 'string') {
579 + message = thrownValue;
580 + }
581 +
582 + // TODO (timeline) Record and cache component stack
583 + if (currentTimelineData) {
584 + currentTimelineData.thrownErrors.push({
585 + componentName,
586 + message,
587 + phase,
588 + timestamp: getRelativeTime(),
589 + type: 'thrown-error',
590 + });
591 + }
592 +
593 + if (supportsUserTimingV3) {
594 + markAndClear(`--error-${componentName}-${phase}-${message}`);
595 }
596 }
597
@@ -591,165 +612,176 @@ export function createProfilingHooks({
612 wakeable: Wakeable,
613 lanes: Lanes,
614 ): void {
594 - if (isProfiling) {
595 - const eventType = wakeableIDs.has(wakeable) ? 'resuspend' : 'suspend';
596 - const id = getWakeableID(wakeable);
597 - const componentName = getDisplayNameForFiber(fiber) || 'Unknown';
598 - const phase = fiber.alternate === null ? 'mount' : 'update';
599 -
600 - // Following the non-standard fn.displayName convention,
601 - // frameworks like Relay may also annotate Promises with a displayName,
602 - // describing what operation/data the thrown Promise is related to.
603 - // When this is available we should pass it along to the Timeline.
604 - const displayName = (wakeable: any).displayName || '';
605 -
606 - let suspenseEvent: SuspenseEvent | null = null;
607 - // TODO (timeline) Record and cache component stack
608 - suspenseEvent = {
609 - componentName,
610 - depth: 0,
611 - duration: 0,
612 - id: `${id}`,
613 - phase,
614 - promiseName: displayName,
615 - resolution: 'unresolved',
616 - timestamp: getRelativeTime(),
617 - type: 'suspense',
618 - warning: null,
619 - };
615 + if (!isProfiling) {
616 + return;
617 + }
618
621 - if (currentTimelineData) {
622 - currentTimelineData.suspenseEvents.push(suspenseEvent);
623 - }
619 + const eventType = wakeableIDs.has(wakeable) ? 'resuspend' : 'suspend';
620 + const id = getWakeableID(wakeable);
621 + const componentName = getDisplayNameForFiber(fiber) || 'Unknown';
622 + const phase = fiber.alternate === null ? 'mount' : 'update';
623
625 - if (supportsUserTimingV3) {
626 - markAndClear(
627 - `--suspense-${eventType}-${id}-${componentName}-${phase}-${lanes}-${displayName}`,
628 - );
624 + // Following the non-standard fn.displayName convention,
625 + // frameworks like Relay may also annotate Promises with a displayName,
626 + // describing what operation/data the thrown Promise is related to.
627 + // When this is available we should pass it along to the Timeline.
628 + const displayName = (wakeable: any).displayName || '';
629
630 - wakeable.then(
631 - () => {
632 - if (suspenseEvent) {
633 - suspenseEvent.duration =
634 - getRelativeTime() - suspenseEvent.timestamp;
635 - suspenseEvent.resolution = 'resolved';
636 - }
630 + let suspenseEvent: SuspenseEvent | null = null;
631 + // TODO (timeline) Record and cache component stack
632 + suspenseEvent = {
633 + componentName,
634 + depth: 0,
635 + duration: 0,
636 + id: `${id}`,
637 + phase,
638 + promiseName: displayName,
639 + resolution: 'unresolved',
640 + timestamp: getRelativeTime(),
641 + type: 'suspense',
642 + warning: null,
643 + };
644
638 - if (supportsUserTimingV3) {
639 - markAndClear(`--suspense-resolved-${id}-${componentName}`);
640 - }
641 - },
642 - () => {
643 - if (suspenseEvent) {
644 - suspenseEvent.duration =
645 - getRelativeTime() - suspenseEvent.timestamp;
646 - suspenseEvent.resolution = 'rejected';
647 - }
645 + if (currentTimelineData) {
646 + currentTimelineData.suspenseEvents.push(suspenseEvent);
647 + }
648
649 - if (supportsUserTimingV3) {
650 - markAndClear(`--suspense-rejected-${id}-${componentName}`);
651 - }
652 - },
653 - );
654 - }
649 + if (supportsUserTimingV3) {
650 + markAndClear(
651 + `--suspense-${eventType}-${id}-${componentName}-${phase}-${lanes}-${displayName}`,
652 + );
653 +
654 + wakeable.then(
655 + () => {
656 + if (suspenseEvent) {
657 + suspenseEvent.duration =
658 + getRelativeTime() - suspenseEvent.timestamp;
659 + suspenseEvent.resolution = 'resolved';
660 + }
661 +
662 + if (supportsUserTimingV3) {
663 + markAndClear(`--suspense-resolved-${id}-${componentName}`);
664 + }
665 + },
666 + () => {
667 + if (suspenseEvent) {
668 + suspenseEvent.duration =
669 + getRelativeTime() - suspenseEvent.timestamp;
670 + suspenseEvent.resolution = 'rejected';
671 + }
672 +
673 + if (supportsUserTimingV3) {
674 + markAndClear(`--suspense-rejected-${id}-${componentName}`);
675 + }
676 + },
677 + );
678 }
679 }
680
681 function markLayoutEffectsStarted(lanes: Lanes): void {
659 - if (isProfiling) {
660 - recordReactMeasureStarted('layout-effects', lanes);
682 + if (!isProfiling) {
683 + return;
684 }
685
686 + recordReactMeasureStarted('layout-effects', lanes);
687 if (supportsUserTimingV3) {
688 markAndClear(`--layout-effects-start-${lanes}`);
689 }
690 }
691
692 function markLayoutEffectsStopped(): void {
669 - if (isProfiling) {
670 - recordReactMeasureCompleted('layout-effects');
693 + if (!isProfiling) {
694 + return;
695 }
696
697 + recordReactMeasureCompleted('layout-effects');
698 if (supportsUserTimingV3) {
699 markAndClear('--layout-effects-stop');
700 }
701 }
702
703 function markPassiveEffectsStarted(lanes: Lanes): void {
679 - if (isProfiling) {
680 - recordReactMeasureStarted('passive-effects', lanes);
704 + if (!isProfiling) {
705 + return;
706 }
707
708 + recordReactMeasureStarted('passive-effects', lanes);
709 if (supportsUserTimingV3) {
710 markAndClear(`--passive-effects-start-${lanes}`);
711 }
712 }
713
714 function markPassiveEffectsStopped(): void {
689 - if (isProfiling) {
690 - recordReactMeasureCompleted('passive-effects');
715 + if (!isProfiling) {
716 + return;
717 }
718
719 + recordReactMeasureCompleted('passive-effects');
720 if (supportsUserTimingV3) {
721 markAndClear('--passive-effects-stop');
722 }
723 }
724
725 function markRenderStarted(lanes: Lanes): void {
699 - if (isProfiling) {
700 - if (nextRenderShouldStartNewBatch) {
701 - nextRenderShouldStartNewBatch = false;
702 - currentBatchUID++;
703 - }
726 + if (!isProfiling) {
727 + return;
728 + }
729
705 - // If this is a new batch of work, wrap an "idle" measure around it.
706 - // Log it before the "render" measure to preserve the stack ordering.
707 - if (
708 - currentReactMeasuresStack.length === 0 ||
709 - currentReactMeasuresStack[currentReactMeasuresStack.length - 1].type !==
710 - 'render-idle'
711 - ) {
712 - recordReactMeasureStarted('render-idle', lanes);
713 - }
730 + if (nextRenderShouldStartNewBatch) {
731 + nextRenderShouldStartNewBatch = false;
732 + currentBatchUID++;
733 + }
734
715 - recordReactMeasureStarted('render', lanes);
735 + // If this is a new batch of work, wrap an "idle" measure around it.
736 + // Log it before the "render" measure to preserve the stack ordering.
737 + if (
738 + currentReactMeasuresStack.length === 0 ||
739 + currentReactMeasuresStack[currentReactMeasuresStack.length - 1].type !==
740 + 'render-idle'
741 + ) {
742 + recordReactMeasureStarted('render-idle', lanes);
743 }
744
745 + recordReactMeasureStarted('render', lanes);
746 if (supportsUserTimingV3) {
747 markAndClear(`--render-start-${lanes}`);
748 }
749 }
750
751 function markRenderYielded(): void {
724 - if (isProfiling) {
725 - recordReactMeasureCompleted('render');
752 + if (!isProfiling) {
753 + return;
754 }
755
756 + recordReactMeasureCompleted('render');
757 if (supportsUserTimingV3) {
758 markAndClear('--render-yield');
759 }
760 }
761
762 function markRenderStopped(): void {
734 - if (isProfiling) {
735 - recordReactMeasureCompleted('render');
763 + if (!isProfiling) {
764 + return;
765 }
766
767 + recordReactMeasureCompleted('render');
768 if (supportsUserTimingV3) {
769 markAndClear('--render-stop');
770 }
771 }
772
773 function markRenderScheduled(lane: Lane): void {
744 - if (isProfiling) {
745 - if (currentTimelineData) {
746 - currentTimelineData.schedulingEvents.push({
747 - lanes: laneToLanesArray(lane),
748 - timestamp: getRelativeTime(),
749 - type: 'schedule-render',
750 - warning: null,
751 - });
752 - }
774 + if (!isProfiling) {
775 + return;
776 + }
777 +
778 + if (currentTimelineData) {
779 + currentTimelineData.schedulingEvents.push({
780 + lanes: laneToLanesArray(lane),
781 + timestamp: getRelativeTime(),
782 + type: 'schedule-render',
783 + warning: null,
784 + });
785 }
786
787 if (supportsUserTimingV3) {
@@ -758,23 +790,25 @@ export function createProfilingHooks({
790 }
791
792 function markForceUpdateScheduled(fiber: Fiber, lane: Lane): void {
761 - if (isProfiling) {
762 - const componentName = getDisplayNameForFiber(fiber) || 'Unknown';
793 + if (!isProfiling) {
794 + return;
795 + }
796
764 - // TODO (timeline) Record and cache component stack
765 - if (currentTimelineData) {
766 - currentTimelineData.schedulingEvents.push({
767 - componentName,
768 - lanes: laneToLanesArray(lane),
769 - timestamp: getRelativeTime(),
770 - type: 'schedule-force-update',
771 - warning: null,
772 - });
773 - }
797 + const componentName = getDisplayNameForFiber(fiber) || 'Unknown';
798
775 - if (supportsUserTimingV3) {
776 - markAndClear(`--schedule-forced-update-${lane}-${componentName}`);
777 - }
799 + // TODO (timeline) Record and cache component stack
800 + if (currentTimelineData) {
801 + currentTimelineData.schedulingEvents.push({
802 + componentName,
803 + lanes: laneToLanesArray(lane),
804 + timestamp: getRelativeTime(),
805 + type: 'schedule-force-update',
806 + warning: null,
807 + });
808 + }
809 +
810 + if (supportsUserTimingV3) {
811 + markAndClear(`--schedule-forced-update-${lane}-${componentName}`);
812 }
813 }
814
@@ -789,28 +823,30 @@ export function createProfilingHooks({
823 }
824
825 function markStateUpdateScheduled(fiber: Fiber, lane: Lane): void {
792 - if (isProfiling) {
793 - const componentName = getDisplayNameForFiber(fiber) || 'Unknown';
826 + if (!isProfiling) {
827 + return;
828 + }
829
795 - // TODO (timeline) Record and cache component stack
796 - if (currentTimelineData) {
797 - const event: ReactScheduleStateUpdateEvent = {
798 - componentName,
799 - // Store the parent fibers so we can post process
800 - // them after we finish profiling
801 - lanes: laneToLanesArray(lane),
802 - timestamp: getRelativeTime(),
803 - type: 'schedule-state-update',
804 - warning: null,
805 - };
806 - currentFiberStacks.set(event, getParentFibers(fiber));
807 - // $FlowFixMe[incompatible-use] found when upgrading Flow
808 - currentTimelineData.schedulingEvents.push(event);
809 - }
830 + const componentName = getDisplayNameForFiber(fiber) || 'Unknown';
831
811 - if (supportsUserTimingV3) {
812 - markAndClear(`--schedule-state-update-${lane}-${componentName}`);
813 - }
832 + // TODO (timeline) Record and cache component stack
833 + if (currentTimelineData) {
834 + const event: ReactScheduleStateUpdateEvent = {
835 + componentName,
836 + // Store the parent fibers so we can post process
837 + // them after we finish profiling
838 + lanes: laneToLanesArray(lane),
839 + timestamp: getRelativeTime(),
840 + type: 'schedule-state-update',
841 + warning: null,
842 + };
843 + currentFiberStacks.set(event, getParentFibers(fiber));
844 + // $FlowFixMe[incompatible-use] found when upgrading Flow
845 + currentTimelineData.schedulingEvents.push(event);
846 + }
847 +
848 + if (supportsUserTimingV3) {
849 + markAndClear(`--schedule-state-update-${lane}-${componentName}`);
850 }
851 }
852