Vue3 v-once 怎么优化静态内容渲染？

Question

仓乃文 · Accepted Answer

页面中有些内容初始化后不会再变化（如标题、固定文案、图标），每次重渲染都会重新创建 VNode 是浪费。v-once 让元素只渲染一次，后续更新直接跳过，减少不必要的 VNode 创建和 diff。静态内容优化： ```html

页面标题

这段文字不会变化

``` 初始化后不变的组件： ```html ``` 补充说明： - v-once 影响所有子节点，整个区块只渲染一次 - 渲染后 VNode 被缓存，后续更新直接复用，不做 diff - 不要对可能变化的内容使用 v-once，否则更新不会生效 - v-once 比 v-memo 更极端，v-memo 可以指定条件，v-once 是永远不更新 - 适合页面头部、底部、固定图标等纯静态内容