1、响应式原理
vue2
vue2中采用 defineProperty 来劫持整个对象，然后进行深度遍历所有属性，给每个属性添加getter和setter，结合发布订阅模式实现响应式。
存在的问题：
- 检测不到对象属性的添加和删除
- 数组API方法无法监听到
- 需要对每个属性进行遍历监听，如果嵌套对象，需要深层监听，造成性能问题
Vue3
vue3采用proxy重写了响应式系统，proxy的监听是针对一个对象的，那么对这个对象的所有操作会进入监听操作。
proxy可以直接监听数组的变化。
2、语法API
vue2
Options API，即选项API。以vue为后缀的文件，通过定义methods，computed，watch，data等属性与方法，共同处理页面逻辑。
然而，当组件变得复杂，导致对应属性的列表也会增长，这可能会导致组件难以阅读和理解。
Vue3
Composition API，即组合式API。组件根据逻辑功能来组织的，一个功能所定义的所有 API 会放在一起（更加的高内聚，低耦合）。
即使项目很大，功能很多，我们都能快速的定位到这个功能所用到的所有 API。
3、Vue3支持多个根节点
Vue2中，组件只能有一个根节点；
Vue3中，组件可设置多个根节点；
4、生命周期
Vue 3 新增了 setup() 函数，替代了 Vue 2 的 beforeCreate 和 created 钩子函数。在 setup() 函数中，我们可以直接访问组件的实例属性和方法，以及通过 next() 函数来访问父组件中的属性和方法。
5、Tree Shaking
tree shaking 是一种通过清除多余代码方式来优化项目打包体积的技术。主要是借助ES6模块的静态编译思想，在编译时就能确定模块的依赖关系，以及输入和输出的变量。
Vue3源码引入tree shaking特性，将全局 API 进行分块。如果您不使用某些功能，它们将不会包含在您的基础包中。
6、Diff算法优化
Vue2
当数据发生变化，它就会新生成一个DOM树，并和之前的DOM树进行比较，找到不同的节点然后更新。但这比较的过程是全量的比较，也就是每个节点都会彼此比较。但其中很显然的是，有些节点中的内容是不会发生改变的，那我们对其进行比较就肯定消耗了时间。
Vue3
在创建虚拟DOM树的时候，会根据DOM中的内容会不会发生变化，添加一个静态标记。那么之后在与上次虚拟节点进行对比的时候，就只会对比这些带有静态标记的节点。
7、静态提升
Vue2中无论元素是否参与更新，每次都会重新创建，然后再渲染。
Vue3中对不参与更新的元素，会做静态提升，只会被创建一次，在渲染时直接复用。这样就免去了重复的创建节点，大型应用会受益于这个改动，免去了重复的创建操作，优化了运行时候的内存占用。
例子：
<span>你好</span>
<div>{{ message }}</div>
没有做静态提升之前
export function render(_ctx, _cache, $props, $setup, $data, $options) {
return (_openBlock(), _createBlock(_Fragment, null, [
_createVNode("span", null, "你好"),
_createVNode("div", null, _toDisplayString(_ctx.message), 1 /* TEXT */)
], 64 /* STABLE_FRAGMENT */))
}
做了静态提升之后
const _hoisted_1 = /*#__PURE__*/_createVNode("span", null, "你好", -1 /* HOISTED */)
export function render(_ctx, _cache, $props, $setup, $data, $options) {
return (_openBlock(), _createBlock(_Fragment, null, [
_hoisted_1,
_createVNode("div", null, _toDisplayString(_ctx.message), 1 /* TEXT */)
], 64 /* STABLE_FRAGMENT */))
}
// Check the console for the AST
静态内容_hoisted_1被放置在render 函数外，每次渲染的时候只要取 _hoisted_1 即可。
同时 _hoisted_1 被打上了 PatchFlag ，静态标记值为 -1 ，特殊标志是负整数表示永远不会用于 Diff。
8、事件监听缓存
默认情况下绑定事件行为会被视为动态绑定，所以每次都会去追踪它的变化。但是因为是同一个函数，所以没必要去追踪它的变化。开启事件侦听器缓存后，没有了静态标记，下次diff算法的时候直接使用提升性能。
9、TypeScript
Vue3是基于typeScript编写的，提供了更好的类型检查，能支持复杂的类型推导。
以上就是个人的一些见解，如有不足或补充，欢迎一起探讨！！！
