vue的diff算法
admin
2024-01-25 19:41:58
0次

vue的diff算法

diff算法是做什么的？

vue中diff算法称为patching算法，由Snabbdom修改而来，虚拟dom想要转换成真实dom则需要通过patch方法转换；

diff算法的必要性

在vue1.x中每个依赖均有更新函数对应，因此不需要虚拟dom和patching算法支持，但是由于粒度过细，导致vue1.x无法承受较大应用，因此在vue2.x中为了降低watcher粒度，每个组件只有一个watcher与之对应，此时就需要patching算法才能精确找到发生变化的位置并高效更新。
简而言之就是为了提升页面性能，精准高效更新

diff算法何时执行

执行时刻是组件内响应式数据变更触发实例执行其更新函数时，更新函数会再次执行render函数获得最新的虚拟dom，然后执行patch函数，并传入新旧两个虚拟dom，通过对比找到变化的地方，最后将其转换为对应DOM操作

diff算法具体执行方式

patch过程是一个递归的过程，遵循深度优先同层比较的策略；以vue3为例：
1、先判断两个节点是否为相同同类节点，不同则删除重建
2、如果双方都是文本，则更新文本内容
3、如果双方都是元素节点则递归更新子元素，同时更新元素属性
4、更新子节点又分几种情况：
1）新的子节点是文本，老的子节点是数组则清空，并设置文本
2）新的子节点是文本，老的子节点也是文本则直接更新文本
3）子节点是数组，老的子节点是文本，则清空文本，并创建新子节点数组中的子元素
4）新的子节点是数组，老的子节点也是数组，那么比较两组子节点，更新细节

vue3中的优化

vue2中是双端算法，先尝试从开头结尾去寻找相同节点，如找到直接做优化做比对，
vue3中引入的更新策略：编译期优化patchFlags、block等

词库加载错误:未能找到文件“E:\highferrum_mysql\Configuration\Dict_Stopwords.txt”。

上一篇：OKR 与 KPI

下一篇：【代码随想录】哈希表专栏（Java）

相关内容

热门资讯

安卓系统不推送更新,揭秘背后的... 最近是不是发现你的安卓手机有点儿“懒”啊？更新推送总是慢吞吞的，让人等得花儿都谢了。别急，今天就来给...
ape格式转换安卓系统,享受音... 你有没有想过，你的安卓手机里的ape格式音乐文件，竟然可以通过一个小小的转换，焕发出全新的生命力？没...
获取安卓系统加载器,核心功能与... 你有没有想过，你的安卓手机里那些神奇的软件和游戏是怎么被安装到你的设备上的呢？没错，就是通过一个叫做...
安卓系统文件夹在哪,安卓系统文... 你有没有遇到过这样的情况：手机里乱糟糟的，想找个文件却找不到？别急，今天就来给你揭秘安卓系统文件夹的...
安卓手感最好的裸机系统,安卓手... 安卓手感最好的裸机系统：探索极致体验的秘密武器在数字世界中，我们常常被各种功能和复杂操作所包围，尤其...
nas如何刷回安卓系统,轻松刷... 你有没有想过，你的NAS（网络附加存储）突然间变成了一个安卓的小天地？别急，这可不是什么天方夜谭，而...
荣耀沿用的安卓系统吗,打造个性... 你有没有注意到，最近荣耀的新机发布，大家都在热议一个问题：荣耀沿用的安卓系统吗？这可是个让人好奇不已...
快麦erp系统安卓下载,一键下... 你有没有听说最近一款叫做快麦ERP系统的软件在安卓平台上大受欢迎呢？没错，就是那个能让你企业管理如虎...
华为安卓系统下载app,一步到... 你有没有发现，最近华为手机的用户们都在忙活一件大事儿？没错，那就是下载安卓系统上的各种app啦！这可...
原生安卓系统游戏模式,畅享沉浸... 亲爱的手机游戏爱好者们，你是否曾为手机游戏运行不畅而烦恼？又或者，你是否渴望在游戏中获得更极致的体验...
安卓9改系统语言设置,轻松切换... 你有没有发现，手机里的语言设置有时候真的让人头疼？比如说，你突然想用一下安卓9的系统语言设置，结果发...
怎么升级安卓最新系统,畅享安卓... 亲爱的手机控们，你是不是也和我一样，对安卓系统的更新充满了期待？每次系统升级，都仿佛给我们的手机带来...
安卓系统电视跳舞毯,家庭娱乐新... 你有没有想过，家里的电视除了用来追剧、看电影，还能变成一个充满活力的娱乐中心？没错，我要给你介绍的就...
安卓系统维护周期,全方位守护您... 亲爱的手机控们，你是不是也和我一样，对安卓系统的维护周期充满了好奇呢？毕竟，我们的手机可是我们日常生...
安卓系统电脑怎么往下滑,一扫即... 你有没有发现，用安卓系统电脑的时候，有时候屏幕上会出现一些小图标或者应用，你想要快速浏览或者切换，却...
手机中判断安卓系统苹果系统js... 你有没有想过，你的手机里到底装的是安卓系统还是苹果系统呢？这可不是一个小问题哦，因为不同的系统，就像...
window系统和安卓系统还原... 你有没有遇到过手机或电脑突然卡顿，或者不小心删掉了重要的文件？别急，今天就来给你详细说说如何让win...
安卓系统打电话变声器,轻松实现... 安卓系统打电话变声器：探索数字时代的通信革新在数字化浪潮中，智能手机已经成为我们生活中不可或缺的一部...
android系统和安卓哪个好... 说到手机操作系统，你是不是也和我一样，对Android系统和安卓系统傻傻分不清楚呢？别急，今天就来给...
米柚系统是不是安卓,基于安卓的... 亲爱的读者，你是否曾在手机的选择上犹豫不决，尤其是当面对那些自称是安卓系统但又有自己特色的操作系统时...