Vue 3 相对于 Vue 2 在性能方面做了很多优化，主要体现在以下几个方面：
响应式系统升级
- 使用 Proxy 替代 Object.defineProperty：在 Vue 2 中，通过
Object.defineProperty来实现数据响应式，这种方式存在一些局限性，比如无法监听数组和对象的新增属性。Vue 3 使用Proxy对象来创建响应式数据，它可以直接监听对象的属性变化，包括新增和删除属性，而且性能更好。 - 更高效的依赖跟踪：Vue 3 的响应式系统采用了更精细的依赖跟踪机制，能够更准确地知道哪些组件依赖了哪些数据，从而在数据变化时更精准地触发组件更新，减少不必要的重新渲染。
虚拟 DOM 优化
- 静态提升：Vue 3 会将模板中不依赖响应式数据的静态节点提升到渲染函数之外，只生成一份静态 VNode，在多次渲染中重复使用，避免了每次渲染都重新创建这些节点，大大提高了渲染性能。
- 片段（Fragment）支持：Vue 3 允许组件的模板返回多个根节点，而无需像 Vue 2 那样必须有一个根节点包裹。这在一些场景下可以减少不必要的 DOM 节点，使虚拟 DOM 结构更加轻量化，提高渲染效率。
- 事件侦听器缓存：对于静态节点上的事件侦听器，Vue 3 会进行缓存，避免在每次渲染时重新创建事件侦听器，从而提高性能。
编译优化
- 模板编译生成更高效的代码：Vue 3 的模板编译器在生成渲染函数时，会进行更多的优化，生成的代码更加简洁和高效。例如，对于一些常见的模板结构，会生成更直接的渲染逻辑，减少不必要的中间操作。
- 按需编译：Vue 3 支持按需编译，只有在需要编译模板时才会进行编译，而不是像 Vue 2 那样在初始化时就编译所有模板。这可以减少初始化时间，特别是在大型应用中，能够显著提高应用的启动速度。
组件初始化优化
- 异步组件加载优化：Vue 3 对异步组件的加载进行了优化，采用了更加高效的异步加载策略，能够更快地加载和渲染异步组件，提高用户体验。
- 更好的 Tree-shaking 支持：Vue 3 的代码结构更加模块化，对 Tree - shaking 的支持更好。在打包时，可以更有效地去除未使用的代码，减小打包后的文件体积，从而提高应用的加载速度。
