type
status
date
slug
summary
tags
category
icon
password
1.React Fiber
react Fiber 原理
2.React Diff 算法
React 的 diff 算法是一种优化 Virtual DOM 更新的算法，它可以比较两个 Virtual DOM 树的差异，并且只更新必要的部分，从而避免了不必要的重新渲染。
React diff 算法的基本思想是将 Virtual DOM 树上的节点按照深度优先的顺序进行比较，比较的过程中可以使用三个指针来跟踪原始树、新树和上一次更新时的树，从而找到需要更新的节点。
具体来说，React diff 算法会按照以下策略进行比较：
- 如果节点类型不同，则直接删除原来的节点，用新节点
替换原来的节点。
- 如果节点类型相同，但是节点的属性不同，则
更新节点的属性。
- 如果节点类型相同，且节点的属性也相同，则
比较节点的子节点。
- 如果节点的子节点有增加或删除，则
更新子节点。
- 如果节点的子节点没有变化，则对每对相同位置的子节点进行
递归比较。
在比较过程中，React diff 算法会尽可能地利用一些启发式的优化策略，比如同级比较、key 值比较等等，以提高比较效率和减少比较次数。
总的来说，React diff 算法是 React 的核心算法之一，它通过有效地比较 Virtual DOM 树的差异来提高渲染性能，同时还可以避免不必要的重新渲染，提高应用程序的性能和用户体验。
- 作者:Piaoyansong
- 链接:https://piaoyansong.top/article/example-18
- 声明:本文采用 CC BY-NC-SA 4.0 许可协议，转载请注明出处。