扫二维码与项目经理沟通
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流
创新互联www.cdcxhl.cn八线动态BGP香港云服务器提供商，新人活动买多久送多久，划算不套路！
小编给大家分享一下关于vue3.0中diff的算法，希望大家阅读完这篇文章后大所收获，下面让我们一起去探讨方法吧！
首先我们来思考一些大中厂面试中，很容易问到的问题：
1 什么时候用到diff算法，diff算法作用域在哪里？
2 diff算法是怎么运作的，到底有什么作用？
3 在v-for 循环列表 key 的作用是什么
4 用索引index做key真的有用？ 到底用什么做key才是最佳方案。
如果遇到这些问题，大家是怎么回答的呢？我相信当你读完这篇文章，这些问题也会迎刃而解。
一 什么时候用到了diff算法,diff算法作用域？
1.1diff算法的作用域
patch概念引入
在vue update过程中在遍历子代vnode的过程中，会用不同的patch方法来patch新老vnode，如果找到对应的 newVnode 和 oldVnode,就可以复用利用里面的真实dom节点。避免了重复创建元素带来的性能开销。毕竟浏览器创造真实的dom，操纵真实的dom，性能代价是昂贵的。
patch过程中，如果面对当前vnode存在有很多chidren的情况,那么需要分别遍历patch新的children Vnode和老的 children vnode。
存在chidren的vnode类型
首先思考一下什么类型的vnode会存在children。
①element元素类型vnode
第一中情况就是element类型vnode 会存在 children vode，此时的三个span标签就是chidren vnode情况
苹果🍎 香蕉🍌 鸭梨🍐
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流
微信二维码
移动版官网