Vue3.0来龙去脉更新历程（vue3最新版本）

这几天补了下 Vue3.0 来龙去脉, 将历届Vue Conf 看了一遍，简单整理成文字版奉献给大家。

2018年

特性

性能提升一倍，内存减少一倍

源码

Proxy 彻底替换 Object.defineProperty 中的Setter、Getter

静态代码渲染（减少JS运行时性能）

利用 Tree-Shaking 消除无用代码

TypeScript 支持更好

模块解藕

插件化设计

Source Map(带位置的Parser)

多端渲染支持

API

Observable、Effect 响应式数据监听API , 跨组件共享状态

RenderTrigger 调试更新机制（组件更新触发原因）

TS 支持（class、interface）

Hooks API 逻辑复用。 取代 mixins。

Time Slicing 。 主线程的任务太多，切分成一帧一帧，分给浏览器yield. 接收用户的输入。省去不需要的性能。

兼容性

IE11, 新的版本，不支持Proxy 的情况， 给出提示。

2019年

问题

Proxy IE11 死而不僵

Vurtual DOM 重写： 核心价值表达里。 旧树新树的比对。 遍历整个树。 组件层面上，性能有待优化。

Diff 算法， 提升Diff 5、6倍的提升

传统的 Diff 算法。React 动态JS, 使用时间分片。兼容render function

更强的表达力，无法取代。生成代码更简洁。

动态静态的切分。切成一个一个每一个静态的块 block tree。减少无谓的遍历。

TypeScript

撤销Class API, 装饰器不稳定。没有优势

API

function-based API

mixins问题（命名空间冲突、多个mixins 模版来源不明）

高阶组件问题（props 命名冲突、来源不明、额外组件实例性能消耗）

v-slot 作用域插槽（没有命名冲突， 数据来源清晰）

React Hooks 只调用一次、内联回调、闭包问题。

2020 年

callback 2018 - 2019

完成 RFCS

新的编译器

支持SSR

结束Beta

新的编译器

完整source map 支持

基于插件转换管道

layered design for higher order 编译器