preloadInstanceAndSuspendIfNeeded() — react Function Reference

Architecture documentation for the preloadInstanceAndSuspendIfNeeded() function in ReactFiberCompleteWork.js from the react codebase.

Function javascript BabelCompiler Validation called by 1

Entity Profile

BabelCompiler→ Validation→ preloadInstanceAndSuspendIfNeeded() — react Function Reference

Dependency Diagram

graph TD
  172f6fb3_884c_b82e_7101_379f58af5f8a["preloadInstanceAndSuspendIfNeeded()"]
  6b05669d_2f09_63a5_e79f_0afc195f25a3["ReactFiberCompleteWork.js"]
  172f6fb3_884c_b82e_7101_379f58af5f8a -->|defined in| 6b05669d_2f09_63a5_e79f_0afc195f25a3
  0b8db832_87fd_e560_8aa8_e2b319c81626["completeWork()"]
  0b8db832_87fd_e560_8aa8_e2b319c81626 -->|calls| 172f6fb3_884c_b82e_7101_379f58af5f8a
  style 172f6fb3_884c_b82e_7101_379f58af5f8a fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/react-reconciler/src/ReactFiberCompleteWork.js lines 550–603

function preloadInstanceAndSuspendIfNeeded(
  workInProgress: Fiber,
  type: Type,
  oldProps: null | Props,
  newProps: Props,
  renderLanes: Lanes,
) {
  const maySuspend =
    (enableSuspenseyImages ||
      (workInProgress.mode & SuspenseyImagesMode) !== NoMode) &&
    (oldProps === null
      ? maySuspendCommit(type, newProps)
      : maySuspendCommitOnUpdate(type, oldProps, newProps));

  if (!maySuspend) {
    // If this flag was set previously, we can remove it. The flag
    // represents whether this particular set of props might ever need to
    // suspend. The safest thing to do is for maySuspendCommit to always
    // return true, but if the renderer is reasonably confident that the
    // underlying resource won't be evicted, it can return false as a
    // performance optimization.
    workInProgress.flags &= ~MaySuspendCommit;
    return;
  }

  // Mark this fiber with a flag. This gets set on all host instances
  // that might possibly suspend, even if they don't need to suspend
  // currently. We use this when revealing a prerendered tree, because
  // even though the tree has "mounted", its resources might not have
  // loaded yet.
  workInProgress.flags |= MaySuspendCommit;

  if (
    includesOnlySuspenseyCommitEligibleLanes(renderLanes) ||
    maySuspendCommitInSyncRender(type, newProps)
  ) {
    // preload the instance if necessary. Even if this is an urgent render there
    // could be benefits to preloading early.
    // @TODO we should probably do the preload in begin work
    const isReady = preloadInstance(workInProgress.stateNode, type, newProps);
    if (!isReady) {
      if (shouldRemainOnPreviousScreen()) {
        workInProgress.flags |= ShouldSuspendCommit;
      } else {
        suspendCommit();
      }
    } else {
      // Even if we're ready we suspend the commit and check again in the pre-commit
      // phase if we need to suspend anyway. Such as if it's delayed on decoding or
      // if it was dropped from the cache while rendering due to pressure.
      workInProgress.flags |= ShouldSuspendCommit;
    }
  }
}