vue3与vue2的区别算是较为火热的面试题之一了，之前早就想整理一遍了，但是奈何没有太多时间去关注。
在两者的深度上，我个人一直觉得自己了解的较少，了解的越深就越不敢说自己深入了解。
经过两个月左右的整理，我应该可以勉强说自己算是略懂了。
这里放上自己的拙见，我尽可能的确认了自己理解的准确性，不过我仍然感觉自己似乎做的不到位，这就当是抛砖引玉，希望大家在评论区多多拍砖。
正文
这段时间看了很多相关的文档，自己也翻了很多遍vue3的官网文档，同时自己也在项目中重新按照自己的经验重新用了一遍Vue3的新写法。
在一段时间的使用之后，个人认为，Vue3与Vue2的区别，要从使用者和开发者的角度来看。
使用者
使用者，就是我们平时写业务的这些普通开发者。
大多数情况下，使用者不负责源码开发，仅仅只要知道有个新特性，然后按照新特性使用就行了。
就像是伐木工学会了用A型号的电锯，这时候电锯做了个升级，加入了一些特性，而我们只要知道如何用好这些新特性。
相对于Vue2，我认为Vue3的新特性如下。
- 取消了根元素，每个组件不必再必须嵌套一个根元素标签了
- 响应式用法的改变，用reactive和ref取代了之前的data声明的变量的方式
- 新增了组合式写法，相对于传统的选项式更灵活，可读性更高，这种写法也支持
- 父子组件传参方式发生了些许改变，不过用法大致和Vue2的思路没差，defineProps，defineEmits，defineExpose这三个稍微看看用法就能很快上手
- 生命周期的写法和名称有些许改变，新增了setup，但是大致流程没有变化
- v-if和v-for的优先级调整，以v-if的优先级更高，如果二者要在同一标签内使用，将v-for放在外边，不然v-if会直接覆盖掉v-for的效果
- 修饰符发生了一些改变，取消了.native，不过总的来说没有太大变化
总之，Vue3相对于Vue2，虽然很多人说是有些破坏式更新，写法发生了巨大的改变，这是一次失败的更新。
但从使用者的角度来讲，我个人认为，这次更新并不算是一次破坏式更新，至少大部分写法和习惯都是保留好了。
这里浅谈一下争论最大的选项式与组合式。
选项式？
选项式就是V2的写法，选项式上手简单，且不容易出岔子，有这个基础架子的保证，新手只要不是特别离谱，写出来的代码至少具有一定的可读性。
但这种写法在代码量上去之后，可读性就会变得差。
主要原因就是变量和函数分开，不同块的变量混合在一起，每次翻阅代码的时候就要上下翻看，要么就要拆开面板去分开看，很麻烦。
而且，所有的变量都是在data中申明，全部指向了this。
指向this固然好用，但是随着后续模块的增多，这些this声明出来的变量会让人不知道这到底是哪个模块的内容，容易造成混乱。
而组合式确实解决了这个痛点。
组合式？
组合式写法其实就是回归了传统的script标签写法，声明了变量，然后按照传统的JS写法继续做就可以。
相对于V2的写法，V3的写法太过自由，可能很多人第一时间拿到手之后会有些不知所措。
不过经过几个项目铺垫之后，大概就能明白组合式的优势了。
组合式相对于选项式，可以更模块化的拆业务，通过reactive包裹不同的代码块之后，我们能够更有逻辑的去切割页面上的逻辑块。
在完成页面的代码块的切分之后，不同变量不会再全部指到this了，这样让我们更清楚这些变量是负责哪个代码块的。
这就是组合式，更模块化，更容易排查，更好的代码可读性。
hooks？minxin？
随着代码量的增加，还可以将多个页面的重复业务块拆出来，放入hooks中供全局使用（Vue2中也有minxin），但是二者实际使用后，就能明白二者的不同。
- hooks像是以前抽离出来的公用方法，抽离的是逻辑，我们将一段公用的逻辑方法封入Hooks中，这里可以封入一定的业务逻辑
- minxin更像是抽离出一部分公用模板，抽离的是模板，我们将一些写烦了的公用方法封入minxin中，省的每次都写。
当然，我这个说法还是有点怪，实际开发中，这二者的用法硬要用的话，可混为一谈的。
不过，我个人依旧推荐大家用hooks去封装逻辑，不要用来封装模板。
开发者
开发者，就是指Vue框架的源码开发者。
源码开发者，大家平时其实很少接触到，不过部分使用者在常规业务开发到极度深入的时候，肯定会去了解相关内容。
尽管我们不去开发，但是用久了，肯定多少会要了解一些的。
相对于Vue2，Vue3在源码层面的特性变动如下
- 整个框架用TS重写，对Vue3对TS有了更好的支持
- 重写了响应式的数据劫持方式，用proxy取代了vue2的Object.defineProperty()
- 重写了虚拟Dom的实现，编译模板优化，更高效的组件初始化效果
- diff算法重写，参考前端 - Vue2、Vue3的diff对比 - 哈啰技术 - SegmentFault 思否
通过这些，开发者做到让Vue3具有了哪些优势呢？
更好的 TypeScript 支持
- Vue 3 的代码库已经全面采用 TypeScript 重写，提供了更好的类型推断和类型提示。
- 提供了更多的内置类型声明，使得开发时更容易发现代码错误和调试。
更好的响应式系统
- Vue 3 使用了 Proxy 来重写响应式系统，相比 Vue 2 的 Object.defineProperty，更加直观和强大。
- 在 Vue 3 中，可以在更深的层次上追踪响应式变量的变化，使得开发者能够更准确地监听数据变化。
更灵活的组合式 API
- Vue 3 引入了组合式 API，使得组件的逻辑可以更好地组织和复用。
- 组合式 API 提供了更直观、更灵活的方式来组织组件代码，使得代码更易读、易维护。
更快的渲染性能
- Vue3 相比 Vue2 来说，Vue3 重写了虚拟
Dom实现，编译模板的优化，更高效的组件初始化。
更小的体积
- Vue 3 的运行时核心相比 Vue 2 更小，这意味着更小的打包体积，减少了前端加载时间。
- Tree-shaking 支持：Vue 3 代码更容易被 Tree-shaking 优化，因此可以更好地剔除不需要的代码。
结语
个人虽然是个vue老登了，但是在很多时候都是在自我学习，所以我整理的这些内容实在是过于浅薄，并未深入，让大家见笑了。
关于Vue2与Vue3的选择，我个人并不排斥任何一种选择，这需要我们根据实际情况来进行选择，很多老项目如果能不动，最好还是别动。
当然，从长远的角度来讲，我还是期望用Vue3的，毕竟Vue2已经停止了更新，而Vue3继承了2的特性，并且还在持续更新，显然Vue3更有潜力。
而且，社区内似乎有不少人开始追随Vue3的更新，同时也出现了VueUse这种社区好物。
长远的来看，显然是Vue3的社区会更壮大。
这种不错的未来前景，是最值得追逐技术的理由之一。