Vue2、Vue3的Diff算法比较

前言

diff算法是vue更新dom前,比较新旧vdom的一种优化方式

特点:

  1. 只会在同一级比较

  2. 从两边往中间收拢

差别

  • vue2 和 vue3的差别在于处理完头尾节点后,对设于节点的处理方式
  • vue2 是遍历旧节点,将旧节点映射到map里,然后再遍历新节点,看是否有可以复用的再打上补丁
  • vue3 是建立一个 新节点的剩余节点在旧节点中的位置 的数组,然后通过数组找到一个最长递增子序列,然后这个序列的节点不动,再去移动剩下的节点。

最长递增子序列

js 复制代码
function lengthOfLIS(nums) {
  const n = nums.length;
  if (n === 0) return 0;

  const dp = new Array(n).fill(1);

  for (let i = 1; i < n; i++) {
    for (let j = 0; j < i; j++) {
      if (nums[i] > nums[j]) {
        dp[i] = Math.max(dp[i], dp[j] + 1)
      }
    }
  }

  return Math.max(...dp);
}
相关推荐
张人玉2 小时前
C# 常量与变量
java·算法·c#
weixin_446122462 小时前
LinkedList剖析
算法
百年孤独_3 小时前
LeetCode 算法题解:链表与二叉树相关问题 打打卡
算法·leetcode·链表
我爱C编程4 小时前
基于拓扑结构检测的LDPC稀疏校验矩阵高阶环检测算法matlab仿真
算法·matlab·矩阵·ldpc·环检测
算法_小学生4 小时前
LeetCode 75. 颜色分类(荷兰国旗问题)
算法·leetcode·职场和发展
运器1234 小时前
【一起来学AI大模型】算法核心:数组/哈希表/树/排序/动态规划(LeetCode精练)
开发语言·人工智能·python·算法·ai·散列表·ai编程
算法_小学生4 小时前
LeetCode 287. 寻找重复数(不修改数组 + O(1) 空间)
数据结构·算法·leetcode
岁忧4 小时前
(LeetCode 每日一题) 1865. 找出和为指定值的下标对 (哈希表)
java·c++·算法·leetcode·go·散列表
alphaTao4 小时前
LeetCode 每日一题 2025/6/30-2025/7/6
算法·leetcode·职场和发展
ゞ 正在缓冲99%…4 小时前
leetcode67.二进制求和
算法·leetcode·位运算