首页
作品
资讯
专题
果动
登录
注册
Yzz
2021年05月03日入驻
合计
2
个作品
累计
17.54
万字
共有
3
订阅
最新
订阅
收藏
lane模型
上一节我们提到Scheduler与React是两套优先级机制。在React中,存在多种使用不同优先级的情况,比如
2023年12月25日
React技术揭秘
Scheduler的原理与实现
在新的React架构一节我们介绍了Scheduler,他包含两个功能:
时间切片
优先级调度
本节我们学习这个两个功能是如何在Scheduler中实现的。
2023年12月13日
React技术揭秘
概览
2023年12月04日
React技术揭秘
useMemo与useCallback
在了解其他hook的实现后,理解useMemo与useCallback的实现非常容易。
本节我们以mount与update两种情况分别讨论这两个hook。
2023年12月02日
React技术揭秘
useRef
ref是reference(引用)的缩写。在React中,我们习惯用ref保存DOM。
事实上,任何需要被"引用"的数据都可以保存在ref中,useRef的出现将这种思想进一步发扬光大。
在Hooks数据结构一节我们讲到:
对于useRef(1),memoizedState保存{current: 1}
本节我们会介绍useRef的实现,以及ref的工作流程。
由于string类型的ref已不推荐使用,所以本节针对function | {current: any}类型的ref。
2023年11月30日
React技术揭秘
useEffect
在架构篇commit阶段流程概览我们讲解了useEffect的工作流程。
其中我们谈到
在flushPassiveEffects方法内部会从全局变量rootWithPendingPassiveEffects获取effectList。
本节我们深入flushPassiveEffects方法内部探索useEffect的工作原理。
2023年11月23日
React技术揭秘
useState与useReducer
Redux的作者Dan加入React核心团队后的一大贡献就是“将Redux的理念带入React”。
这里面最显而易见的影响莫过于useState与useReducer这两个Hook。本质来说,useState只是预置了reducer的useReducer。
本节我们来学习useState与useReducer的实现。
2023年11月21日
React技术揭秘
Hooks数据结构
在上一节我们实现了一个极简的useState,了解了Hooks的运行原理。
本节我们讲解Hooks的数据结构,为后面介绍具体的hook打下基础。
2023年11月20日
React技术揭秘
极简Hooks实现
为了更好理解Hooks原理,这一节我们遵循React的运行流程,实现一个不到100行代码的极简useState Hook。建议对照着代码来看本节内容。
2023年11月08日
React技术揭秘
Hooks理念
如果你还未使用过Hooks,可以从官方文档开始。
2023年10月27日
React技术揭秘
this.setState
当我们有了前面知识的铺垫,就很容易理解this.setState的工作流程。
2023年10月19日
React技术揭秘
ReactDOM.render
经过五章的学习,我们终于回到了React应用的起点。
这一节我们完整的走通ReactDOM.render完成页面渲染的整个流程。
2023年09月15日
React技术揭秘
深入理解优先级
通过更新的心智模型,我们了解到更新具有优先级。
那么什么是优先级?优先级以什么为依据?如何通过优先级决定哪个状态应该先被更新?
本节我们会详细讲解。
2023年09月03日
React技术揭秘
Update
通过本章第一节学习,我们知道状态更新流程开始后首先会创建Update对象。
本节我们学习Update的结构与工作流程。
你可以将Update类比心智模型中的一次commit。
2023年08月21日
React技术揭秘
心智模型
在深入源码前,让我们先建立更新机制的心智模型。
在后面两节讲解源码时,我们会将代码与心智模型联系上,方便你更好理解。
2023年07月24日
React技术揭秘
流程概览
经过前几章的学习,我们终于有足够的前置知识理解状态更新的整个流程。
这一章我们看看几种常见的触发状态更新的方法是如何完成工作的。
2023年07月03日
React技术揭秘
多节点Diff
上一节我们介绍了单一节点的Diff,现在考虑我们有一个FunctionComponent:
2023年06月10日
React技术揭秘
单节点Diff
对于单个节点,我们以类型object为例,会进入reconcileSingleElement
2023年06月04日
React技术揭秘
概览
本章为选读章节
是否学习该章对后续章节的学习没有影响。
2023年05月22日
React技术揭秘
layout阶段
该阶段之所以称为layout,因为该阶段的代码都是在DOM渲染完成(mutation阶段完成)后执行的。
该阶段触发的生命周期钩子和hook可以直接访问到已经改变后的DOM,即该阶段是可以参与DOM layout的阶段。
2023年05月16日
React技术揭秘
前一页
后一页