React 虚拟dom

虚拟dom react核心机制

内存中轻量级JS对象树模拟真实DOM,主要目的是减少操作真实dom的开销

具体是通过diff算法计算最小的变更,批处理更新真实dom元素

diff算法

特点

同级去进行比较,不涉及跨层的一个比较

使用key值优化列表遍历过程

对相同类型的节点,递归比较其子节点

具体流程

从根节点出发,IF类型不同,销毁旧节点和子树,ELSE更新变化的属性进入子节点的递归

list diff 双指针遍历策略 old指针 new 指针

new和old相同key 复用节点

不同销毁old节点

改进:支持中断遍历,拆分为多个小任务。和优先级调度

相关推荐
元气少女小圆丶10 分钟前
unity发布web嵌入到前端页面的接受参数
前端·unity·webgl
工业HMI实战笔记11 分钟前
【拯救HMI】:低碳制造:自动化技术如何助力企业节能降耗
运维·前端·自动化·交互·制造
柒和远方1 小时前
V043:BFF 层流式输出:从前端直连到生产级流式网关的架构演进
javascript·架构·node.js
用户938515635072 小时前
SSE 流式输出的工程化拐点——为什么你需要一个 BFF 层
javascript·人工智能·全栈
不简说2 小时前
JS 代码技巧 vol.4 — 10 个异步并发控制,Promise.all 这帮兄弟的踩坑实录
前端·javascript·面试
YFF菲菲兔2 小时前
React 不冒泡的移入 / 移出事件插件
react.js
Sinclair2 小时前
安企CMS的安装-PHPStudy(小皮面板)部署
前端·后端
YFF菲菲兔2 小时前
React 表单控件 onChange 事件插件
react.js
会飞的特洛伊2 小时前
IAM身份认证
前端·后端
钛态3 小时前
AI 组件生成评测:别只看页面能不能渲染
前端·vue·react·web