v-once 是编译期静态冻结，v-memo 是运行时条件记忆化；前者永久跳过响应式追踪与 diff，后者依依赖数组浅比较决定子树是否复用。
v-once 和 v-memo 是 Vue 3 中两个轻量但高效的渲染优化指令，它们不改变业务逻辑，只在虚拟 DOM 更新阶段“踩刹车”，让不需要重绘的部分彻底跳过 diff 和 patch。
v-once：静态内容的硬性冻结
它不是缓存，而是编译期标记。Vue 编译器会把带 v-once 的节点识别为静态节点，提升为模块级常量 vnode，后续所有更新周期中直接复用，完全绕过：
- 响应式依赖收集（不触发 effect）
- 虚拟节点 diff 对比（不进入 patchElement）
- 真实 DOM 操作（不调用 insert/remove/setAttribute）
适合页脚版权、协议文本、固定导航栏、图标组件等真正永不变化的内容。注意：一旦加了 v-once，后续数据再变也不会更新显示，所以不能用于需要动态响应的字段。
v-memo：带条件的子树记忆化
v-memo 是运行时决策，靠依赖数组控制是否跳过子树更新。每次更新前，Vue 会浅比较传入的数组（如 v-memo="[id, status]"）与上一次缓存的值：
vue-component-analyzer
下载
递归分析 Vue 项目组件依赖，从入口文件生成组件层级图，支持 Vue 2/3，输出组件名、文件路径和属性。适用于分析组件结构、排查依赖或了解项目架构。
立即学习“前端免费学习笔记（深入）”；
- 全部相等 → 复用旧 vnode，跳过整个子树的 diff 和 patch
- 任一不等 → 正常渲染，并更新缓存数组
它不阻止响应式追踪，子组件内部仍可正常响应变化，只控制“这一段结构要不要重算”。特别适合列表项、表格行、实时行情卡片等局部稳定、整体高频更新的场景。
关键区别与使用提醒
v-once 是“拍快照”，v-memo 是“看条件”。两者语义不同，不能混用在同一元素上：
- v-memo="[]" 功能上等价于 v-once，但表达的是“无依赖需检查”，而非“永不变”
- v-once 不接受参数；v-memo 必须传入固定长度、语义明确的数组（比如用 item.id 而非 item）
- 避免用对象引用、undefined 或函数返回值作为 v-memo 依赖项，否则浅比较失效
- 二者都不影响首次渲染速度，只减少后续更新开销
它们不是万能药，但用对地方，能让高频率更新的页面保持丝滑。
