vue2与vue3的区别

区别：

        数据双向绑定

        VDOM（虚拟DOM）

        Fragments

        Tree-Shanking的支持

        Composition API

数据双向绑定

        以前有介绍过  Vue2和Vue3响应式区别_思ۣۖิิۣۖิ❧❦空❧❦的博客-CSDN博客

VDOM

        在vue2中，每次更新真实DOM之前都是对虚拟DOM全量对比  vue3中则是只对比带有标记的，这样大大的减少了非动态内容的对比消耗

可以去 Vue Template Explorer 查看如何标记

 Fragments

        vue2在template下只能有一个子节点，而vue3可以有多个

        同时支持render函数和JSX写法，类似于react中，在render函数里写逻辑代码

Tree-Shanking

        相对于vue2来说，减少了打包体积。比如项目当中使用了watch，没有使用computed，那么vue3中就是按需导入watch，再使用，打包时只会打包watch，不会打包compted，而vue2中的实例是单例的，捆绑程序无法检测到当前对象的哪些属性被使用到

Composition API

         Vue3 中新增的功能，它的灵感来自于 React Hooks ，是比 mixin 更强大的存在。

        可以提高代码逻辑的可复用性，从而实现与模板的无关性；同时使代码的可压缩性更强。另外，把 Reactivity 模块独立开来，意味着 Vue3.0 的响应式模块可以与其他框架相组合。

 如上图，composition-api 把复杂组件的逻辑抽地更紧凑，而且可以将公共逻辑进行抽取。