React源码解析

React源码解析

React源码解析

React（17.0.2）专栏，对 React 核心的、开发者经常接触到的一些源码做解析讲解，包括 Fiber 架构、diff算法、Hook函数等内容。比较适合对 React 有一定了解，想要从源码的角度深入理解 React 底层原理的同学。

等 4 人订阅共6篇文章创建于2023-01-18

React源码解析（六）：useState与useReducer源码解析

useState 和 useReducer 可以说是 React 最基础也是最常用的两个 Hook 了，在介绍这两个钩子函数源码之前，先引入几个源码当中的变量，以便大家更好的理解。

1年前
1.2k
8
评论

React源码解析（六）：useState与useReducer源码解析

React源码解析（五）：reconcileChildren源码解析

reconcileChildren 主要作用是动态比较已缓存的虚拟 DOM 树与新的 element 对象，生成 workInProgress 的所有子节点，没有缓存说明是新节点，会直接创建。

1年前
123
点赞
评论

React源码解析（五）：reconcileChildren源码解析

React源码解析（四）：beginWork与completeWork源码解析

beginWork 对整棵树的每一个节点进行更新操作，通过 switch (workInProgress.tag) 对不同的组件做不同的更新处理，更新当前节点 workInProgress ...

1年前
265
点赞
评论

React源码解析（四）：beginWork与completeWork源码解析

React源码解析（三）：workLoop工作过程及源码

React WorkLoop 核心工作原理及源码，current 与 workInProgress 全局变量的关系，performUnitOfWork主要功能。

1年前
195
点赞
评论

React源码解析（三）：workLoop工作过程及源码

React源码解析（二）：React中的数据结构FiberRoot和Fiber

React 当中的 element 对象和 Fiber 虚拟 DOM 树的结构以及之间的区别和联系。

1年前
77
点赞
评论

React源码解析（二）：React中的数据结构FiberRoot和Fiber

React源码解析（一）：React17版本整体架构介绍

React 17 版本整体架构，包含 reconcile 模块和 schedule 模块，它们之间的协作方式，以及时间切片、优先级等概念。

1年前
231
点赞
评论

React源码解析（一）：React17版本整体架构介绍