搜索历史

{{ i+1 }}{{ v }}

搜索推荐

{{ i+1 }}{{ v }}

"react diff 原理?"

转载翻译原创

问答题 · 前端 · react · @{ formatTime(detail.create_time) }

react diff 原理?

把树形结构按照层级分解，只比较同级元素。
给列表结构的每个单元添加唯一的 key 属性，方便比较。
React 只会匹配相同 class 的 component（这里面的 class 指的是组件的名字）
合并操作，调用 component 的 setState 方法的时候, React 将其标记为 dirty.到每一个事件循环结束, React 检查所有标记 dirty 的 component 重新绘制.
选择性子树渲染。开发人员可以重写 shouldComponentUpdate 提高 diff 的性能。

PS：写作不易，如要转裁，请标明转载出处。

猜你想看: 什么是高阶组件？; 如何避免组件的重新渲染？; 为什么虚拟 dom 会提高性能?; useMemo & useCallback的作用是什么？

回顶部