anchor 是 patch 插入逻辑的定位标尺，指代父容器内作为插入参照的 dom 节点；传入时调用 insertbefore 插在它前面，为 null 时退化为 appendchild，支撑 hydration、列表移动等精确位置控制。

Patch 函数里的 anchor 不是指 HTML 中的 <a name></a> 锚点，也不是 document.anchors 那个集合；它是一个插入参考位置的 DOM 节点，用于告诉 patch：新创建的 DOM 元素应该插到父容器的哪个位置——是在它前面、后面，还是作为最后一个子节点。

anchor 是 patch 插入逻辑的“定位标尺”

在真实 DOM 更新过程中，patch 并不总是把新节点无脑追加（appendChild）到父容器末尾。当需要维持节点顺序（比如列表更新、动态插入、过渡动画或服务端渲染 SSR 的 hydrate 场景），就必须精确控制插入位置。这时，anchor 就作为那个“已存在的参照物”：

• 如果传入了 anchor，patch 会调用 parentNode.insertBefore(newNode, anchor)，把新节点插在 anchor 前面
• 如果 anchor 为 null 或 undefined，才退化为 appendChild
• 这个机制让 patch 支持“中间插入”“保持原有 DOM 序列”等精细操作，是实现高效复用和 hydration 对齐的基础

常见出现 anchor 的场景

anchor 参数通常由上层调用方显式传入，不是 patch 自己生成的。典型用例包括：

• 组件挂载时的 hydrate 过程：服务端已输出 HTML，客户端 patch 需复用这些真实节点，并把新 vnode 插入到对应 anchor（如注释节点或占位元素）处，避免闪屏
• 列表 diff 中的节点移动：当某个带 key 的 vnode 从末尾移到开头，patch 会找到目标位置前一个节点作为 anchor，执行 insertBefore 实现“移动”语义
• Fragment 或多根节点渲染：多个 vnode 要插入同一父容器，但彼此之间有顺序依赖，后续节点以之前已插入节点为 anchor

anchor 和 key 的关系：一个管“位置”，一个管“身份”

key 决定“这个新节点是否能复用旧 DOM”，而 anchor 决定“复用后的 DOM 或新建的 DOM 最终放在哪”。二者协同才能保证：

• 相同 key 的节点不被销毁重建（节省性能）
• 它们在父容器中的相对顺序与 vnode.children 数组一致（保证渲染正确）
• 没有 anchor 时，即使 key 匹配，也可能因 appendChild 导致顺序错乱（尤其在非末尾插入时）

源码中 anchor 的典型签名

以 Vue 3 的 renderer.ts 为例，patch 相关函数常带 anchor 参数：

function patch(n1, n2, container, anchor?, parentComponent?, ...)

其中 container 是父容器，anchor 是可选的插入锚点——它必须是 container 的子节点（或 null），否则 insertBefore 会报错。