作者：前端开发爱好者
原文：mp.weixin.qq.com/s/zbUCreQ8F…
“干掉虚拟 DOM” 的口号喊了好几年，现在 Vue 终于动手了。
就在前天，Vue 3.6 alpha 带着 Vapor Mode 低调上线：编译期直接把模板编译成精准 DOM 操作，不写 VNode、不 diff，包更小、跑得更快。
不同于社区实验，Vapor Mode 是 Vue 官方给出的「标准答案」：
- 依旧是熟悉的单文件组件，只是
<script setup>上加一个vapor开关； - 依旧是
响应式系统，但运行时不再生成 VNode，编译期直接把模板转换成精准的原生 DOM 操作； - 与
Svelte、Solid的最新基准横向对比，性能曲线几乎重合，首屏 JS 体积却再降 60%。
换句话说，Vue 没有「另起炉灶」，而是让开发者用同一套心智模型，一键切换到「无虚拟 DOM」的快车道。
接下来 5 分钟，带你一次看懂 Vapor Mode 的底层逻辑、迁移姿势和未来路线图。
什么是 Vapor Mode？
一句话总结：把虚拟 DOM 编译掉，组件直接操作真实 DOM，包体更小、跑得更快。
100%可选，旧代码无痛共存。- 仅支持
<script setup>的 SFC，加一个vapor开关即可。 - 与
Solid、Svelte 5在第三方基准测试里打平，甚至局部领先。
<script setup vapor>
// 你的组件逻辑无需改动
</script>
性能有多夸张？
官方给出的数字：
| 场景 | 传统 VDOM | Vapor Mode |
|---|---|---|
| Hello World 包体积 | 22.8 kB | 7.9 kB ⬇️ 65% |
| 复杂列表 diff | 1× | 0.6× ⬇️ 40% |
| 内存峰值 | 100% | 58% ⬇️ 42% |
一句话：首屏 JS 少了三分之二，运行时内存直接腰斩。
能不能直接上生产？
alpha 阶段，官方给出“三用三不用”原则：
✅ 推荐这样做
- 局部替换：把首页、营销页等性能敏感模块切到
Vapor。 - 新项目：脚手架直接
createVaporApp，享受极简 bundle。 - 内部尝鲜：提
Issue、跑测试、贡献PR，帮社区踩坑。
❌ 暂时别这样
- 现有组件整体迁移（API 未 100% 对标）。
- 依赖
Nuxt、Transition、KeepAlive的项目(还在支持的路上)。 - 深度嵌套第三方
VDOM组件库（边界case仍可能翻车）。
开发者最关心的 5 个问题
- 旧代码要改多少？
不用改！只要<script setup>加vapor。Options API 用户请原地踏步。 - 自定义指令怎么办？
新接口更简单：接收一个响应式getter，返回清理函数即可。官方已给出codemod，一键迁移。 - 还能不能用 Element Plus / Ant Design Vue？
可以，但需加vaporInteropPlugin。目前仅限标准props、事件、插槽，复杂组件可能有坑。 - TypeScript 支持如何？
完全保持现有类型推导，新增VaporComponent类型已同步到@vue/runtime-core。 - 和 React Forget、Angular Signal 比谁快？
基准测试在同一梯队，但Vue的迁移成本最低——同一份代码，加个属性就提速。
一行代码，立刻体验
- 纯 Vapor 应用（最小体积）
import { createVaporApp } from 'vue'
import App from './App.vue'
createVaporApp(App).mount('#app')
- 在现有 Vue 项目中混合使用
import { createApp, vaporInteropPlugin } from 'vue'
import App from './App.vue'
createApp(App)
.use(vaporInteropPlugin)
.mount('#app')
使用时只需在单文件组件的 <script setup> 标签上加 vapor 属性即可启用新模式。
<script setup vapor>
// 你的组件逻辑无需改动
</script>
打开浏览器，Network 面板里 app.js 只有 8 kB，简直离谱。
写在最后
从 2014 年的响应式系统，到 2020 的 Composition API，再到 2025 的 Vapor Mode，Vue 每一次大版本都在 “把复杂留给自己，把简单留给开发者” 。
这一次，尤大不仅把虚拟 DOM 编译没了，还把“性能焦虑”一起编译掉了。
领先的不只是速度，还有对开发者体验的极致尊重。
Vue 3.6 正式版预计 Q3 发布，现在开始试 alpha，刚刚好。
- v3.6.0-alpha.1 相关文档：
https://github.com/vuejs/core/releases/tag/v3.6.0-alpha.1
