DOM属性更新先于文本更新，因patchVnode流程中先批量更新class、style等属性，再处理子节点，最后才调用setTextContent；属性就绪是保障disabled、contenteditable等行为正确及样式不闪动的前提。
Vue 渲染时，DOM 属性更新确实先于文本内容更新执行，这不是人为设定的“优先级开关”，而是 patch 流程中自然形成的执行顺序，核心目的是保障 DOM 结构与行为的一致性。
属性更新发生在子节点比对之前
当新旧 vnode 类型相同（sameVnode），进入 patchVnode 流程后，Vue 会按固定步骤处理：
- 先批量更新元素属性：包括 class、style、props、attrs、事件绑定（如 @click） 等；
- 再递归比对和更新子节点（即 updateChildren）；
- 子节点处理完毕后，才检查当前 vnode 是否含纯文本（
vnode.text != null），并调用 setTextContent 更新文本。
为什么必须先改属性？
属性直接影响元素的渲染状态和交互能力，延迟更新可能引发异常：
vue-component-analyzer
下载
递归分析 Vue 项目组件依赖，从入口文件生成组件层级图，支持 Vue 2/3，输出组件名、文件路径和属性。适用于分析组件结构、排查依赖或了解项目架构。
- contenteditable 或 disabled 属性若滞后设置，可能导致文本在禁用状态下仍可编辑或触发事件；
- style 变更若晚于文本插入，会出现短暂样式错位（比如字体未加载完成就显示文字）；
- 某些属性（如 key、ref）是 diff 和组件复用的基础，必须在子内容挂载前就位。
文本更新是子节点层面的终局操作
文本本质上是元素的子节点（text node），它的更新属于子节点处理流程的收尾环节：
立即学习“前端免费学习笔记（深入）”；
- 如果 vnode 有
children，文本更新被跳过，由子节点 patch 控制； - 如果 vnode 是纯文本节点（无 children，仅有 text 字段），才会走
setTextContent(el, vnode.text)； - 这个操作不涉及结构重建，仅替换文本内容，因此放在属性就绪之后更安全、也更高效。
它不是“竞争关系”，而是协作链条
属性与文本更新并非互斥选项，而是一个连贯的 DOM 同步过程：
- 属性更新确保宿主元素具备正确的上下文（尺寸、状态、样式）；
- 子节点更新负责结构组织（新增/移动/删除元素）；
- 文本更新作为叶子节点的最终填充动作，在整个树更新完成后统一落实。
