本文探讨了React中如何管理内存中的CurrentTree和FiberTree，当状态变化时，如何通过DOMDiff算法高效地比较节点并更新DOM。DOMDiff会比较节点类型、属性、文本等，利用key来决定节点复用或重新创建，从而减少不必要的DOM操作，提高性能。
内存中存储两颗树，一颗树是已经渲染的树结构（Current Tree），另一颗是即将变化的树（Fiber Tree）。
每次状态发生变化，会对原来的树结构进行遍历，遍历过程中，会通过比较每个节点的结构与之前 Fiber 结构的区别，生成新的树，最终将新的树与旧的树进行替换。
DOM Diff 的依据很多：会通过比较 ElementType、Props、文本、属性等相关来决定是复用原来的节点还是创建新的节点。
DOM Diff 在列表的对比中，会通过 key 来进行唯一标识符定位，如果 key 未发生变化，则认为节点可复用。只会进行移动操作，而不会重新创建
扫一扫
评论
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
查看更多评论
添加红包
