From dfb6130e69a150bb3d654d863406254d3304f6a9 Mon Sep 17 00:00:00 2001 From: YuJian920 Date: Wed, 11 May 2022 00:19:24 +0800 Subject: [PATCH] vault backup: 2022-05-11 00:19:24 --- .../React 源码的碎片记录.md | 0 .../React 的流程解析 - Fiber 递归.md | 2 +- .../React 的深入探索 - effectList 链表.md | 0 .../奇怪的疑惑.md | 2 +- 数据结构与算法之美/数据结构 - 链表.md | 2 +- 自顶向下学 React 源码/beginWork 和 completeWork.md | 6 ------ 6 files changed, 3 insertions(+), 9 deletions(-) rename {自顶向下学 React 源码 => React 的源码深入}/React 源码的碎片记录.md (100%) rename 自顶向下学 React 源码/effectList 的生成.md => React 的源码深入/React 的流程解析 - Fiber 递归/React 的深入探索 - effectList 链表.md (100%) rename {自顶向下学 React 源码 => React 的源码深入}/奇怪的疑惑.md (95%) delete mode 100644 自顶向下学 React 源码/beginWork 和 completeWork.md diff --git a/自顶向下学 React 源码/React 源码的碎片记录.md b/React 的源码深入/React 源码的碎片记录.md similarity index 100% rename from 自顶向下学 React 源码/React 源码的碎片记录.md rename to React 的源码深入/React 源码的碎片记录.md diff --git a/React 的源码深入/React 的流程解析 - Fiber 递归/React 的流程解析 - Fiber 递归.md b/React 的源码深入/React 的流程解析 - Fiber 递归/React 的流程解析 - Fiber 递归.md index 853db05..7cd645e 100644 --- a/React 的源码深入/React 的流程解析 - Fiber 递归/React 的流程解析 - Fiber 递归.md +++ b/React 的源码深入/React 的流程解析 - Fiber 递归/React 的流程解析 - Fiber 递归.md @@ -55,4 +55,4 @@ completeWork 负责深度优先遍历中的回溯阶段，**它执行在递归 这里你可能会有一个疑惑，在 Fiber 递归阶段也就是 reconciler 阶段，会深度优先遍历找出所有的存在变化的 Fiber 节点，并将其打上对应的 effectTag，**那么进入 commit 阶段后，也需要再次进行一次深度优先遍历找出这些存在 effectTag 的 Fiber 节点吗？** -其实是不需要的，因为这样的效率太低了，在深度优先遍历的回溯阶段也就是 completeWork 的执行逻辑中，会将所有存在 effectTag 的 Fiber 节点通过单项链表的形式连接起来，这样在 commit 阶段的时候只需要遍历这一条链表就能快速的找到发生了变化的 Fiber 节点：[[effectList 的生成]] \ No newline at end of file +其实是不需要的，因为这样的效率太低了，在深度优先遍历的回溯阶段也就是 completeWork 的执行逻辑中，会将所有存在 effectTag 的 Fiber 节点通过单项链表的形式连接起来，这样在 commit 阶段的时候只需要遍历这一条链表就能快速的找到发生了变化的 Fiber 节点：[[React 的深入探索 - effectList 链表]] \ No newline at end of file diff --git a/自顶向下学 React 源码/effectList 的生成.md b/React 的源码深入/React 的流程解析 - Fiber 递归/React 的深入探索 - effectList 链表.md similarity index 100% rename from 自顶向下学 React 源码/effectList 的生成.md rename to React 的源码深入/React 的流程解析 - Fiber 递归/React 的深入探索 - effectList 链表.md diff --git a/自顶向下学 React 源码/奇怪的疑惑.md b/React 的源码深入/奇怪的疑惑.md similarity index 95% rename from 自顶向下学 React 源码/奇怪的疑惑.md rename to React 的源码深入/奇怪的疑惑.md index 0d979d0..cc31004 100644 --- a/自顶向下学 React 源码/奇怪的疑惑.md +++ b/React 的源码深入/奇怪的疑惑.md @@ -11,4 +11,4 @@ - 是的 - [ ] reconcileChildren 的具体功能？ - [x] reconciler 阶段会深度优先遍历找出所有需要更新或者发生更改的 Fiber 节点，然后遍历出完整的Fiber，然后作为参数传递给 commitRoot 函数进入 commit 阶段，那么在 commit 阶段也要对 Fiber 树进行深度优先遍历吗？ - - [[effectList 的生成]] \ No newline at end of file + - [[React 的深入探索 - effectList 链表]] \ No newline at end of file diff --git a/数据结构与算法之美/数据结构 - 链表.md b/数据结构与算法之美/数据结构 - 链表.md index 65dc844..0292e24 100644 --- a/数据结构与算法之美/数据结构 - 链表.md +++ b/数据结构与算法之美/数据结构 - 链表.md @@ -2,4 +2,4 @@ ## 反转单向链表 -## \ No newline at end of file +## 使用链表实现队列 \ No newline at end of file diff --git a/自顶向下学 React 源码/beginWork 和 completeWork.md b/自顶向下学 React 源码/beginWork 和 completeWork.md deleted file mode 100644 index 6daf026..0000000 --- a/自顶向下学 React 源码/beginWork 和 completeWork.md +++ /dev/null @@ -1,6 +0,0 @@ -在 [[React 源码的碎片记录]] 中写了，在 React 的 Fiber 递归阶段会有两个函数，分别执行递和归两个动作，它们就是 beginWork 和 completeWork -```javascript -function beginWork(current, workInProgress, renderLanes) {} -``` -### 小结 -- 当一个 Fiber 节点进入 beginWork 时，它的目的是创建当前 Fiber 节点的一个子 Fiber 节点，会根据 Element 的类型进入不同的 update 逻辑，在 update 逻辑中，会先判断是否够存在对应的 current 节点(reconcileChildren)来决定标记是否追踪副作用(?)，最后再根据 element child 的类型来执行不同的创建操作，最终创建子 Fiber 节点 \ No newline at end of file