当前位置:
AIGC文章详情

Vue 3.6 RC 发布,虚拟 DOM 变成可选项:现在升级还是等正式版?

源自85位全网作者

19:06

7月中旬,Vue 悄悄推送了 3.6 的首个 RC 版本(v3.6.0-rc.1)。知乎一周之内,前端圈的标题一个比一个唬人:「Vapor Mode 来了」「Vue 性能超越 Solid」「虚拟 DOM 的葬礼」。知乎但对真正在维护 Vue 项目的人来说,值得关心的其实只有一个问题:我的项目要不要升,现在升还是再等等?

把官方说明、社区讨论和几份基准测试交叉核对之后,先说结论:这是 Vue 近年来动静最大的一次底层改动,但也是最不需要着急的一次升级。

3.6 改了什么:不是新 API,是地基换了

3.6 在表面几乎没有新增 API,它动的是底下三层东西。

第一层是讨论度最高的 Vapor Mode。传统 Vue 组件会把模板编译成渲染函数,生成 VNode 树,再由虚拟 DOM 的 diff 决定怎么更新真实 DOM。Vapor 换了一条路:模板在编译期直接生成命令式的 DOM 创建与更新代码,中间不再有 VNode 这一层。知乎

Vue 3.6 RC 发布,虚拟 DOM 变成可选项:现在升级还是等正式版?

而且它不是强推。Vapor Mode 以组件为单位开启,在 script setup 上加一个 vapor 属性,这个组件就走新管线。知乎它可以和传统 VDOM 组件在同一个应用里互相嵌套。知乎如果整个应用全部用 Vapor,虚拟 DOM 的运行时根本不会被加载。知乎官方把话说得很清楚:这是一个选项,不是替代。

Vue 3.6 RC 发布,虚拟 DOM 变成可选项:现在升级还是等正式版?

第二层是响应式系统的重写。3.6 把 @vue/reactivity 的实现换成了 alien-signals。知乎这个信号库只有 1KB,依赖追踪改用 Push-Pull 结构。社区基准测试里,它的响应式性能比 3.4 快约 4 倍、比 3.5 快约 1.8 倍,computed 的吞吐量提升号称有 30 倍。知乎注意,这些数字来自特定场景的社区基准,实际体感要看业务结构。但对不打算碰 Vapor 的项目来说,这层收益是默认的,升上去就有。

Vue 3.6 RC 发布,虚拟 DOM 变成可选项:现在升级还是等正式版?

第三层是构建。尤雨溪早就预告过 Rolldown(Rust 编写的 Rollup 后继者)会并入 Vite,如今正在逐步落地,Vue 生态的构建链条整体转向 Rust 化。今年 7 月 18 日在上海举办的 Vue & Vite Conf 上,Vapor Mode 也是核心议题之一,社区对它的态度已经从「实验性特性」变成了「值得认真规划的方向」。哔哩哔哩

Vue 3.6 RC 发布,虚拟 DOM 变成可选项:现在升级还是等正式版?

社区在吵什么:这算不算抄 Solid?

RC 发布后,争得最凶的一个问题是:Vapor Mode 是不是在抄 Solid?

「抄 Solid」派有他们的道理:编译时生成、无虚拟 DOM、细粒度更新,这条路确实是 Solid 先走出来的。知乎但反驳同样尖锐:Vue 卖本来就不是范式首创,同样的 ref、同样的模板、同样的组合式 API,只加一个属性就能拿到接近 Solid 的运行时表现,外加完整的生态和几乎为零的迁移成本,这本身就是护城河。

还有一种流传很广的调侃:「绕了一大圈,又回到 jQuery 了?」本质上是说,Vapor 模式下那些直接操作 DOM 的代码,不是人写的,是编译器写的。手写 jQuery 是混乱,编译器生成的 jQuery 是性能。

Vue 3.6 RC 发布,虚拟 DOM 变成可选项:现在升级还是等正式版?

真正值得记住的是反方向的声音。最近有一篇流传挺广的文章《告别构建时代》,核心观点是 AI 时代呼唤前端彻底回归「无编译」范式。知乎框架竞争的重心,也正在从「运行时谁快」转向「编译器谁聪明、运行时谁轻」,React 推出 React Compiler、Vue 推进 Vapor Mode,走的其实是同一条路。知乎Solid、Svelte 5、Vue Vapor 正在同一点上汇合:重编译、轻运行时、信号为核心。这不是谁抄谁,而是行业集体走到了同一个答案面前。

比性能数字更该先看的三个坑

跑分好看归好看,决定动手之前,先把三个坑说清楚。官方对 RC 的定位也很直白:面向框架作者、组件库作者和早期尝鲜者,不是给生产项目的。知乎

第一,实例能力有缺口。Vapor 组件目前不暴露 $el、$props、$attrs、$slots、$refs 这些实例属性。全局属性注入也不支持。知乎项目里要是靠这些特性干活,升级就不是加一个属性的事。

第二,组件库生态是最大的变量。Vue 项目里用得最多的 Element Plus,目前是纯虚拟 DOM 实现,官方文档也承认混合模式下仍有边界问题。知乎主流组件库没有 Vapor 原生版本之前,应用的性能上限其实捏在组件库手里。哔哩哔哩

Vue 3.6 RC 发布,虚拟 DOM 变成可选项:现在升级还是等正式版?

第三,跑分不等于业务现实。社区基准测的多是大列表、高频更新这类极端场景,你的项目瓶颈可能在接口、在业务逻辑、在某个第三方组件。先用性能工具定位瓶颈,再谈 Vapor,顺序别反。

谁该动手,谁该再等等

结合上面的信息,按人群给个参考:

生产环境跑 3.5 的项目,别急。3.5 本身是个很成熟的版本,Vapor 的收益要等组件库和工具链跟上才能完整兑现,等 GA 之后再观察一两个季度不迟。

新项目和个人项目,可以尝鲜。哔哩哔哩Vapor 是按组件开启的,试错成本很低,现在踩坑等于帮社区排雷,纯 Vapor 应用的体验也值得记录。

性能敏感场景,比如长列表、复杂编辑器、重可视化,值得跟踪,也值得在非核心页面先试点。这类场景恰好是编译期优化收益最大的地方。

正在准备面试的前端,可以开始学了。「虚拟 DOM 变成可选项」已经出现在面试讨论里,两条渲染管线的区别很快会变成基础题。

值得盯着的几个信号

选择观望的话,把这四个信号收好。一是 3.6 GA 的时间点,从 alpha 到 RC 走了差不多一年,官方节奏明显偏谨慎,GA 何时落地本身就是最值得盯的信号。二是 Element Plus、Naive UI 这类主流组件库的 Vapor 适配进展,这是「能用」和「能上生产」的分水岭;三是官方迁移指南和升级清单;四是 vue-router、Pinia 对纯 Vapor 应用的兼容表态。

一句话收尾:这可能是 Vue 史上成本最低的一次大版本升级,也是第一次生态分水岭。观望是免费的,尝鲜也不用急,让组件库作者们先上。

内容由AI生成
0
扫一下,分享更方便,购买更轻松
0评论

当前文章无评论,是时候发表评论了
提示信息

取消
确认
评论举报

最新文章 热门文章