vue 知识储备

vue2 和 vue3 的区别

1. 模块拆分：vue3采用 compnent API 更注重模块上的拆分，而vue2中则需要使用完整的vuejs，无法使用单独的模块
2. 重写API：vue2组件方法挂载到实例中未使用也会被打包，vue3通过 tree-shaking机制，实现按需引入，减少用户打包后体积
3. 数据双向绑定：vue2使用 Object.defineProperty 进行数据劫持，需要对属性进行重新添加 getter，setter ，而 vue 使用 proxy 进行数据代理

• 3.1 当新增和删除属性时无法监控变化。需要通过 $set，$delete 实现
• 3.2 数组不采用 defineProperty 进行劫持(浪费性能，对索引劫持造成性能浪费)

4. diff算法：vue3模板编译优化，采用 PathchFlags 优化动态节点

vue的diff算法 和 vue3的区别

1. diff概念：vue基于虚拟DOM做更新，核心是比较两个虚拟节点的差异。vue的diff算法是平级比较，不考虑跨级比较的情况。内部采用 深度递归 + 双指针 的方式比较
2. diff比较流程
   • 1. 先比较是否是相同节点 key tag(标识，标签名)