一、vue3.0更新特性

  • 源码组织方式
  • composition API
  • 性能提升
  • Vite

    二、源码组织方式

    采用TS重新编写,使用Monorepo管理项目结构

    三、composition API 设计动机

  • position API

包含组建选项(data、methods、props)等,但是复杂组建时,同一个逻辑功能被拆分到不同选项中;

  • composition API

一组基于函数的api,可以更灵活的组织组件逻辑

四、性能提升

响应式系统升级

Object.defineProperty =>Proxy 对象重写响应式系统
可以监听动态新增属性 2.0调用$set
可以监听删除的属性
可以监听数组的索引和length属性
提升了响应式系统的性能和功能

2.编译优化

vue2中通过标记静态根节点优化diff
vue3只能够标记提升所有的静态根节点,diff的时候只需要对比动态节点的内容

  • fragments 升级vetur插件 :不需要唯一的根节点
  • 静态提升 :将静态节点提升到render的外面
  • patch flag :给动态节点绑定个flag,按照flag类型进行比对判断
  • 缓存事件处理函数

    3.优化打包体积

  • 移除一些不常用的api inline-tmeplate、filter

  • Tree-shaking

五、Vite
1、ES moudul