diff --git a/自顶向下学 React 源码/React 源码的碎片记录.md b/自顶向下学 React 源码/React 源码的碎片记录.md index f2a6ee5..e877462 100644 --- a/自顶向下学 React 源码/React 源码的碎片记录.md +++ b/自顶向下学 React 源码/React 源码的碎片记录.md @@ -15,5 +15,6 @@ - React 会尽量的复用 Fiber,在创建 workInProgress Fiber 时,如果 current Fiber 中节点的 alternate 属性已经指向一个 Fiber 节点,那么新创建的 workInProgress Fiber 节点就会基于这个 alternate 指向的 Fiber 节点来创建,这种基于已有 Fiber 节点做对比生成新的 workInProgress Fiber 的过程就是 diff 算法,所以首屏渲染和更新渲染最大的区别就在于是否有 diff 算法 - 对于首屏渲染来说,只有根节点具有 current Fiber 而子节点不存在 - React render 阶段的工作分为归阶段和递阶段,在递阶段执行 beginWork,而在归阶段,执行 completeWork -- 如果 render 的递归阶段,如果节点只存在一个文本子节点,那么这个子节点将不会进入 beginWork 递阶段,而是由它父节点直接进入 completeWork 归阶段,这是 React 做的一个优化,而这一个功能在 -- Host Components 会进入 updateHostComponent 逻辑,zai \ No newline at end of file +- 如果 render 的递归阶段,如果节点只存在一个文本子节点,那么这个子节点将不会进入 beginWork 递阶段,而是由它父节点直接进入 completeWork 归阶段,这是 React 做的一个优化,而这一个逻辑在 updateHostComponent方法中的 isDirectTextChild 可以看到 +- Host Components 会进入 updateHostComponent 逻辑,在 React 18是 updateHostComponent$1 +- updateHostComponent 方法中的 reconcileChildren 方法会为当前 Fiber 节点创建它的子 Fiber 节点,也就是 Fiber 中的 child 属性 \ No newline at end of file