react diff 原理

1.把树形结构按照层级分解,只比较同级元素。

2.给列表结构的每个单元添加唯一的 key 属性,方便比较。

3.React 只会匹配相同 class 的 component(这里面的 class 指的是组件的名字)

4.合并操作,调用 component 的 setState 方法的时候, React 将其标记为 dirty.到每一个事件循环结束, React 检查所有标记 dirty 的 component 重新绘制.

5.选择性子树渲染。开发人员可以重写 shouldComponentUpdate 提高 diff 的性能。

相关推荐
懒羊羊我小弟4 分钟前
Vue与React组件化设计对比
前端·vue.js·react.js
_朱志强8 分钟前
解决前端vue项目在linux上,npm install,node-sass 安装失败的问题
linux·前端·vue.js
excel35 分钟前
webpack 检出图 第 二 节
前端
excel38 分钟前
webpack 检出图 第 一 节
前端
专注前端不学习一天浑身难受38 分钟前
基于uniapp 实现画板签字
前端·uniapp
低代码布道师41 分钟前
加油站小程序实战教程11会员注册
前端·javascript·低代码·小程序
好_快43 分钟前
Lodash源码阅读-apply
前端·javascript·源码阅读
好_快44 分钟前
Lodash源码阅读-getNative
前端·javascript·源码阅读
luoganttcc2 小时前
Cesium 加载 本地 b3dm 格式文件 并且 获取鼠标点击处经纬度 (亲测可用)
前端·javascript·3d
云边有个稻草人3 小时前
【Web前端技术】第二节—HTML标签(上)
前端·html·html基本结构标签·html超链接标签·html中的注释和特殊字符·vscode的使用·vscode生成骨架标签