# React 源码的碎片记录 - 每一个 Fiber 节点都会链接它的第一个子节点、下一个兄弟节点和父节点,并且在 Fiber 节点中还会保存组件的状态和需要更新的副作用 - Reconciler 会从根节点一直向下递到子节点,再从子节点一路向上归到根节点 - Fibet 中的 tag 属性保存了组件类型,如 Function Component、Class Component - Fiber 中的 elementType 和 type 属性在大部分时候时相同,但是在 Function Component 使用React.memo 包裹时会有不同 - Fiber 中的 type 属性在使用 Function Component 时是函数本身,Class Component 时是 Class,Host Component 时是 DOM 节点的 Tag Name - Fiber 中的 stateNode 属性对于 Host Component 而言,是它的真实 DOM 节点 - Fiber 中的 return、child、sibling 属性则对应链接Fiber链表中的父节点、子节点和兄弟节点 - Fiber 中的 index 属性代表在多个同级 Fiber 节点中,它们插入的位置索引 - Fiber 中带有 effcet 名称的属性代表与副作用相关,Host Component 中的 DOM 的增删改查,Functuon 中的 useEffect、useLayoutEffect - Fiber 中的 lanes 属性和 childLanes 属性与 Fiber 的优先级的调度有关 - Fiber 中的 alternate 属性则表示了 Fiber 的工作方式 - React 的双缓存:React 有着 current Fiber 树和存在于内存中的 workInProgress Fiber 树 - React 的双缓存:每一次 React 的更新都会创建一个 workInProgress Fiber 树,current Fiber 和 workInProgress Fiber 之间使用 alternate 属性链接,方便公用属性,当 workInProgress Fiber 完成渲染,FiberRootNode 的指针就会指向 workInProgress Fiber 树的根节点 RootFiber,这时 workInProgress Fiber 就变成了 current Fiber 树