updateTracingMarkerComponent() — react Function Reference

Architecture documentation for the updateTracingMarkerComponent() function in ReactFiberBeginWork.js from the react codebase.

Function javascript BabelCompiler Validation calls 2 called by 1

Entity Profile

BabelCompiler→ Validation→ updateTracingMarkerComponent() — react Function Reference

Dependency Diagram

graph TD
  378fe066_0c65_1514_f9d1_c435960ed7e3["updateTracingMarkerComponent()"]
  0be70812_cc0c_b210_f84f_8e61dd5f831c["ReactFiberBeginWork.js"]
  378fe066_0c65_1514_f9d1_c435960ed7e3 -->|defined in| 0be70812_cc0c_b210_f84f_8e61dd5f831c
  235e1db1_02a4_912f_7d82_ea6636c850c0["beginWork()"]
  235e1db1_02a4_912f_7d82_ea6636c850c0 -->|calls| 378fe066_0c65_1514_f9d1_c435960ed7e3
  7badfe56_dd53_2584_1ece_c84f6bcd3505["pushMarkerInstance()"]
  378fe066_0c65_1514_f9d1_c435960ed7e3 -->|calls| 7badfe56_dd53_2584_1ece_c84f6bcd3505
  cf5641cc_b89e_d6b2_5d40_41ad5bbdd682["reconcileChildren()"]
  378fe066_0c65_1514_f9d1_c435960ed7e3 -->|calls| cf5641cc_b89e_d6b2_5d40_41ad5bbdd682
  style 378fe066_0c65_1514_f9d1_c435960ed7e3 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/react-reconciler/src/ReactFiberBeginWork.js lines 1280–1330

function updateTracingMarkerComponent(
  current: Fiber | null,
  workInProgress: Fiber,
  renderLanes: Lanes,
) {
  if (!enableTransitionTracing) {
    return null;
  }

  const nextProps: TracingMarkerProps = workInProgress.pendingProps;

  // TODO: (luna) Only update the tracing marker if it's newly rendered or it's name changed.
  // A tracing marker is only associated with the transitions that rendered
  // or updated it, so we can create a new set of transitions each time
  if (current === null) {
    const currentTransitions = getPendingTransitions();
    if (currentTransitions !== null) {
      const markerInstance: TracingMarkerInstance = {
        tag: TransitionTracingMarker,
        transitions: new Set(currentTransitions),
        pendingBoundaries: null,
        name: nextProps.name,
        aborts: null,
      };
      workInProgress.stateNode = markerInstance;

      // We call the marker complete callback when all child suspense boundaries resolve.
      // We do this in the commit phase on Offscreen. If the marker has no child suspense
      // boundaries, we need to schedule a passive effect to make sure we call the marker
      // complete callback.
      workInProgress.flags |= Passive;
    }
  } else {
    if (__DEV__) {
      if (current.memoizedProps.name !== nextProps.name) {
        console.error(
          'Changing the name of a tracing marker after mount is not supported. ' +
            'To remount the tracing marker, pass it a new key.',
        );
      }
    }
  }

  const instance: TracingMarkerInstance | null = workInProgress.stateNode;
  if (instance !== null) {
    pushMarkerInstance(workInProgress, instance);
  }
  const nextChildren = nextProps.children;
  reconcileChildren(current, workInProgress, nextChildren, renderLanes);
  return workInProgress.child;
}