vue3已经出来有一段时间了,相信很多公司项目都已经在用vue3重构项目,或者在新项目中直接用vue3搭建,那么我们学习vue3的必要性就有了。
v2 与 v3 的区别
- v3 采用的是
monorepo方式进行管理,将模块拆分到package目录中 - v3 采用的
ts开发,增强类型检测,v2 则采用flow - v3 性能优化,支持
tree-shaking,不使用就不打包 - v2 后期引入
rfc,使每个版本改动可控rfcs
v3 内部代码优化
- v3 的数据劫持采用的是 proxy,v2 劫持数据采用的是
defineProperty,defineProperty有性能问题和缺陷 - v3 对模版编译进行了优化,编译时生成了
block tree,可以对子节点的动态节点进行收集,可以减少对比,并且采用了 patchFlag 标记动态节点 - v3 采用了
compositionApi进行组织功能,解决反复横跳,优化复用逻辑(mixin 带来的数据来源不清晰,命名冲突等),相比optionsApi推断更加方便 - 增加了
fragment,teleport,suspend组件
v3 架构分析
1.Monorepo 介绍
- reactivity:响应式系统
- runtime-core:运行时核心,与平台无关
- runtime-dom:针对浏览器的运行时,包括 dom api 属性,事件处理
- runtime-test:测试
- server-renderer:服务端渲染
- compiler-core:与平台无关的编译核心
- compiler-dom:针对浏览器的编译模块
- compiler-ssr:针对服务端渲染的编译模块
- compiler-sfc:针对单文件的解析
- size-check;用来测试代码体积
- template-explore:用于调试编译器输出的开发工具
- shared:多个包之间的共享内容
- vue:完整版本,包括运行时和编译器




![[禁止登录]登录失败,建议升级最新版本后重试,或通过问题反馈与我们联系。(错误码:45)](https://img-blog.csdnimg.cn/7f7a6d2fbc65435792889918dc14669d.png)















