From 00d3b7d1fb48e136b0a4ea89259cfed7374aaa0b Mon Sep 17 00:00:00 2001 From: YuJian Date: Wed, 13 Apr 2022 09:39:13 +0800 Subject: [PATCH] vault backup: 2022-04-13 09:39:12 --- 自顶向下学 React 源码/React 源码的碎片记录.md | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/自顶向下学 React 源码/React 源码的碎片记录.md b/自顶向下学 React 源码/React 源码的碎片记录.md index 4bcada0..e243255 100644 --- a/自顶向下学 React 源码/React 源码的碎片记录.md +++ b/自顶向下学 React 源码/React 源码的碎片记录.md @@ -12,4 +12,6 @@ - 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 树 -- React 会尽量的复用 Fiber，在创建 workInProgress Fiber 时，如果 current Fiber 中节点的 alternate 属性已经指向一个 Fiber 节点，那么新创建的 workInProgress Fiber 节点就会基于这个 alternate 指向的 Fiber 节点来创建，这种基于已有 Fiber 节点做对比生成新的 workInProgress Fiber 的过程就是 diff 算法，所以首屏渲染和更新渲染最大的区别就在于是否有 diff 算法 \ No newline at end of file +- React 会尽量的复用 Fiber，在创建 workInProgress Fiber 时，如果 current Fiber 中节点的 alternate 属性已经指向一个 Fiber 节点，那么新创建的 workInProgress Fiber 节点就会基于这个 alternate 指向的 Fiber 节点来创建，这种基于已有 Fiber 节点做对比生成新的 workInProgress Fiber 的过程就是 diff 算法，所以首屏渲染和更新渲染最大的区别就在于是否有 diff 算法 +- 对于首屏渲染来说，只有根节点具有 current Fiber 而子节点不存在 +- React render 阶段的g \ No newline at end of file