深切FiberRoot

1. 引见

  • 全部运用的出发点
  • 包括运用挂载的目的出发点
  • 纪录全部运用更新过程的种种信息

2.相干函数及内容

export function createContainer(
  containerInfo: Container,
  isConcurrent: boolean,
  hydrate: boolean,
): OpaqueRoot {
  return createFiberRoot(containerInfo, isConcurrent, hydrate);
}

createContainer中我们返回了createFiberRoot函数的实行效果,
然就在ReactFiberRoot中我们挪用了createFiberRoot,,它返回一个root对象:

root = ({
      current: uninitializedFiber,
        // 代表当前对应的fiber,这里是未初始化的fiber
      containerInfo: containerInfo,
        // 代表容器的节点
      pendingChildren: null,
        //只要在耐久化更新的平台会用到,在react-Dom中不会被用到
      earliestPendingTime: NoWork,
         //最老的正在举行中的使命,这里初始化都为Nowork为0,最低优先级
      latestPendingTime: NoWork,
          //最新的正在举行中的使命
      earliestSuspendedTime: NoWork,
          //最老的被挂起的使命
      latestSuspendedTime: NoWork,
          //最新的被挂起的使命
      latestPingedTime: NoWork,
            
      pingCache: null,

      didError: false,
       //标记全部运用在衬着的过程当中是不是有毛病
      pendingCommitExpirationTime: NoWork,
      //正在提交的使命的ExpirationTime,也就是优先级
      finishedWork: null,
      //在render阶段已完成了的使命,在commit阶段只会实行finishedWork的使命
      timeoutHandle: noTimeout,
      //用来清算还没有被触发的计时器
      context: null,
      //顶层的context对象,只用在挪用“renderSubTreeIntoContainer”的时刻在有效
      pendingContext: null,
      hydrate,
      //运用是不是要和本来的dom节点举行兼并
      nextExpirationTimeToWorkOn: NoWork,
      //纪录下一次将要举行的对应的优先级的使命
      expirationTime: NoWork,
      //当前的优先级的使命
      firstBatch: null,
      
      nextScheduledRoot: null,
        //链表的构造,两次react-Domrender衬着的。。节点的链表
      interactionThreadID: unstable_getThreadID(),
      // 交互的线程id
      memoizedInteractions: new Set(),
      //上次交互的线程id的Set对象
      pendingInteractionMap: new Map(),
      //举行中的交互的线程的Map对象
    }: FiberRoot);
    原文作者:lllluull
    原文地址: https://segmentfault.com/a/1190000018769016
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞