10月5日,尤大大带着pre-alpha版本的Vue3.0走来了。在这里插入图片描述

粗略看了一下源码,发现源码基本都转化成了 typeScript 。

我们对照着 “ Vue 3.0 Updates ” 的主题演讲来分析一下:

1、速度方面:

通过更新 runtime-core 与 runtime-dom ,支持了包括 Fragments、Portals与Suspense w/ async setup() 等(似乎有点越来越像 react),支持 Composition API 、Options API 和 typings,配合 Proxy 的引入,极大程度上提高了响应式的能力。

Composition API 与 Proxy 的运用使得组件化更加灵活,逻辑业务组件的编写与UI组件的多样化能够更好的实现。

2、体积方面:

runtime-core 体积压缩成了 约10kb

3、维护性:

代码迁移成 TypeScript (还没学的抓紧啦)

编译器(Compiler)优化,以下借用尤大大的特性更新图翻译一下:

使用模块化架构

优化 "Block tree"

更激进的 static tree hoisting 功能

支持 Source map

内置标识符前缀(又名 "stripWith")

内置整齐打印功能

移除 source map 和标识符前缀功能后,使用 Brotli 压缩的浏览器版本精简了大约 10KB

可见,编译器更多从数据结构入手,优化架构层级,降低使用成本。

4、更接近原生开发

5、让你更轻松开发

 其次是 GitHub 上的源码目录:

  • reactivity 目录:数据响应式系统,主要使用 Proxy。
  • runtime-core 目录:支持 v-dom 与 Vue 原生的各种 API 在浏览器上的调用,调用 Vue 特性的相关代码。
  • runtime-dom 目录: 调用各类浏览器原生 DOM 事件的相关代码。
  • runtime-test 目录: 测试用的runtime的相关代码。
  • server-renderer 目录: SSR 相关代码。
  • compiler-core 目录: 支持 Vue 原生编写的 编译器特性,以及开发者编写的编译器特性的相关代码。
  • compiler-dom 目录: 调用浏览器的编译器的相关代码。
  • shared 目录: 无内置API。
  • vue 目录: 实现 vue 构建与编译的相关代码。

 

Logo

前往低代码交流专区

更多推荐