类别
结构
层级
1.dom 渲染树 提供增删改查方法 直接操作dom
vnode 描述渲染树 数据驱动渲染 需要机制间接操作dom
-
children key 优化 staticNode 优化 Fragment
-
增 mount 删unmonet 移动move 更新 update patch
-
挂载内部有副作用
-
文本 注释
-
元素 fragment(空标签) -> 内置组件 Transition TransitionGroup KeepAlive Teleport Suspense 内置指令 v-xx 特殊元素 component slot template 特殊属性 key ref is -> property
-
children -> key
-
component(api) ->
optionAPI
(publicThis ctx proxy prop inject data computed methods watch provide lifeCycle render inheritAttrs components directives applyOptions template render compilerOptions )
compositionAPI
(Reactivity toXX isXX raw shallow readonly proxy ReactiveEffect effectScope LifeCycle onXX Helper useXX )
关系
总览（按职责分组）
- 渲染入口与总控
- render：渲染入口，创建 renderer 后的对外 API，内部调用 patch。
- patch：核心调度，根据 VNode 类型分发到不同 process* 路径。
- getNextHostNode：获取下一个宿主 DOM 节点（用于 Fragment/移动时找锚点）。
- 各节点类型处理器（process）
- processElement：元素类 VNode 的挂载/更新分发。
- processComponent：组件类 VNode 的挂载/更新分发。
- processFragment：Fragment 的挂载/更新（仅管理其 children）。
- Text（或 processText）：文本节点的挂载/更新。
- processCommentNode：注释节点的挂载/更新。
- 元素挂载/更新细化
- mountElement：创建元素、设置属性/事件、挂载 children、插入 DOM。
- patchElement：元素更新总控，对比/更新 props 与 children。
- patchProps：对比旧新 props，按需增/改/删宿主属性。
- mountChildren：初次挂载子节点（递归 patch(null, child)）。
- patchChildren：更新子节点（选择 keyed/unkeyed/文本 等分支）。
- patchUnkeyedChildren：无 key 子节点的顺序对比更新。
- patchKeyedChildren：带 key 子节点的 Diff（包含 LIS 优化移动）。
- patchBlockChildren：基于 block tree 的优化更新（跳过不变子树）。
- setScopeId：为节点及后代设置/继承作用域 id（CSS scope/SSR 标记等）。
- 静态节点（静态提升）
- mountStaticNode：一次性挂载静态内容（无需响应式更新）。
- patchStaticNode：静态节点（极少数）需要替换/切换时的处理。
- moveStaticNode：移动静态节点（如 Fragment 重排）。
- removeStaticNode：移除静态节点。
- 组件挂载/更新细化
- mountComponent：创建组件实例、运行 setup、建立渲染 effect 并执行首次渲染。
- setupRenderEffect：用 ReactiveEffect 包装组件渲染，区分首次挂载与后续更新的执行流程、调度时机与生命周期钩子。
- updateComponent：组件更新入口（决定是否需要更新、推进到渲染）。
- updateComponentPreRender：组件更新前把新 VNode/props 注入实例（同步 instance.vnode/props/slots 等）。
- 移动与卸载
- move：把某个 VNode（含其子树）移动到新位置（处理过渡/Teleport/Fragment）。
- remove：移除单个 VNode 的宿主节点（含过渡处理）。
- removeFragment：移除 Fragment 范围的一组宿主节点。
- unmount：卸载任意 VNode（分发到元素/组件/Fragment 的卸载流程）。
- unmountChildren：批量卸载一组子节点。
- unmountComponent：卸载组件实例（生命周期、指令钩子、依赖清理等）。
差异要点（记忆版）
- 按类型分：process* 是“分发器”，把 Element/Component/Fragment/Text/Comment 分别带到各自挂载/更新路径。
- 按阶段分：mount* 是初次创建和插入；patch* 是差异更新；unmount*/remove* 是移除清理；move 是重排。
- 子节点策略：patchChildren 决策，patchKeyedChildren/patchUnkeyedChildren 执行具体 Diff。
- 组件与渲染：mountComponent 建立实例；setupRenderEffect 用 ReactiveEffect 让依赖变更驱动更新；updateComponentPreRender 负责把新输入同步入实例。
- 静态优化：mountStaticNode/patchStaticNode/moveStaticNode/removeStaticNode 处理静态提升的块，避免不必要对比。
