发布时间

宣布 Vue 3.0 "One Piece"

作者

one-piece-logo

今天,我们很自豪地宣布 Vue.js 3.0 "One Piece" 正式发布。这个框架的新主要版本提供了改进的性能、更小的包大小、更好的 TypeScript 集成、用于处理大型用例的新 API,以及为框架的长期未来迭代奠定了坚实的基础。


3.0 版本代表了超过 2 年的开发工作,包括 30 多个 RFC、2,600 多个提交、628 个来自 99 位贡献者 的拉取请求,以及核心仓库之外的大量开发和文档工作。我们想对我们的团队成员承担这项挑战、我们的贡献者提交的拉取请求、我们的 赞助商和支持者 提供的财务支持,以及更广泛的社区参与我们的设计讨论并为预发布版本提供反馈表示最衷心的感谢。Vue 是一个为社区创建并由社区维护的独立项目,没有你们的持续支持,Vue 3.0 就不可能实现。

将“渐进式框架”概念推向更远

从最初的简陋开始,Vue 就有一个简单的使命:成为一个任何人都可以快速学习的易于理解的框架。随着我们的用户群不断增长,框架的范围也随之扩大,以适应不断增长的需求。随着时间的推移,它发展成为我们所说的“渐进式框架”:一个可以逐步学习和采用的框架,同时在用户处理越来越复杂的情况时提供持续的支持。

如今,Vue 在全球拥有超过 130 万用户*,我们看到 Vue 被用于各种各样的场景,从在传统服务器端渲染页面上添加交互性,到具有数百个组件的完整单页应用程序。Vue 3 将这种灵活性推向了更远。

分层内部模块

Vue 3.0 核心仍然可以通过简单的 <script> 标签使用,但其内部结构已从头开始重写为 一组解耦的模块。新的架构提供了更好的可维护性,并允许最终用户通过 tree-shaking 将运行时大小减少一半。

这些模块还公开了更低级的 API,从而解锁了许多高级用例

  • 编译器支持自定义 AST 变换,用于构建时自定义(例如 构建时 i18n
  • 核心运行时提供了一流的 API,用于创建针对不同渲染目标的自定义渲染器(例如 原生移动WebGL终端)。默认的 DOM 渲染器使用相同的 API 构建。
  • @vue/reactivity 模块 导出提供对 Vue 的响应式系统直接访问的函数,并且可以用作独立的包。它可以与其他模板解决方案(例如 lit-html)甚至在非 UI 场景中使用。

用于处理规模的新 API

2.x 基于对象的 API 在 Vue 3 中基本保持不变。但是,3.0 还引入了 Composition API - 一组新的 API,旨在解决 Vue 在大型应用程序中使用时遇到的痛点。Composition API 建立在响应式 API 之上,并支持类似于 React hooks 的逻辑组合和重用、更灵活的代码组织模式,以及比 2.x 基于对象的 API 更可靠的类型推断。

Composition API 也可以通过 @vue/composition-api 插件与 Vue 2.x 一起使用,并且已经存在适用于 Vue 2 和 3 的 Composition API 实用程序库(例如 vueusevue-composable)。

性能改进

Vue 3 在包大小(使用 tree-shaking 最轻可达 41%)、初始渲染(最快可达 55%)、更新(最快可达 133%)和内存使用(最少可达 54%)方面,与 Vue 2 相比,已证明 性能显着提升

在 Vue 3 中,我们采用了“编译器感知的虚拟 DOM”方法:模板编译器执行积极的优化,并生成渲染函数代码,该代码提升静态内容、留下绑定类型的运行时提示,最重要的是,扁平化模板内的动态节点以减少运行时遍历的成本。因此,用户可以同时获得模板的编译器优化性能,或者在用例需要时通过手动渲染函数进行直接控制。

改进的 TypeScript 集成

Vue 3 的代码库是用 TypeScript 编写的,并带有自动生成、测试和捆绑的类型定义,因此它们始终是最新的。Composition API 与类型推断配合得很好。Vetur,我们的官方 VSCode 扩展,现在支持模板表达式和道具类型检查,利用 Vue 3 改进的内部类型。哦,如果这是你的偏好,Vue 3 的类型 完全支持 TSX

实验性功能

我们已经为单文件组件 (SFC,即 .vue 文件) 提出了 两个新功能

这些功能已经在 Vue 3.0 中实现并可用,但仅用于收集反馈。它们将保持实验性状态,直到 RFC 合并。

我们还实现了一个目前未记录的 <Suspense> 组件,它允许在初始渲染或分支切换时等待嵌套的异步依赖项(异步组件或具有 async setup() 的组件)。我们正在与 Nuxt.js 团队一起测试和迭代此功能(Nuxt 3 正在开发中),并可能在 3.1 中将其固化。

分阶段发布流程

Vue 3.0 的发布标志着框架的总体准备就绪。虽然一些框架子项目可能还需要进一步工作才能达到稳定状态(特别是开发工具中的路由器和 Vuex 集成),但我们认为现在开始使用 Vue 3 进行新的绿地项目是合适的。我们还鼓励库作者开始将您的项目升级以支持 Vue 3。

查看 Vue 3 库指南,了解所有框架子项目的详细信息。

迁移和 IE11 支持

由于时间限制,我们推迟了迁移构建(具有 v2 兼容行为 + 迁移警告的 v3 构建)和 IE11 构建,并计划在 2020 年第四季度重点关注它们。因此,计划迁移现有 v2 应用程序或需要 IE11 支持的用户应注意此时存在的这些限制。

下一步

在发布后的短期内,我们将重点关注

  • 迁移构建
  • IE11 支持
  • 新开发工具中的路由器和 Vuex 集成
  • 进一步改进 Vetur 中的模板类型推断

目前,Vue 3 和面向 v3 的项目的文档网站、GitHub 分支和 npm 分发标签将保留在 next 标记的状态下。这意味着 npm install vue 仍然会安装 Vue 2.x,而 npm install vue@next 会安装 Vue 3。我们计划在 2021 年初将所有文档链接、分支和分发标签切换为默认使用 3.0。

与此同时,我们已经开始规划 2.7 版本,这将是 2.x 版本线的最后一次计划中的小版本发布。2.7 将会从 v3 版本回溯兼容的改进,并在使用 v3 中移除/更改的 API 时发出警告,以帮助潜在的迁移。我们计划在 2021 年第一季度完成 2.7 版本的开发,该版本发布后将直接成为 LTS 版本,并拥有 18 个月的维护周期。

试用一下

要了解更多关于 Vue 3.0 的信息,请查看我们的 新文档网站。如果您是现有的 Vue 2.x 用户,请直接前往 迁移指南