月归档:2022年12月

理解React Fiber

Why

What

How

首先我们看下React里定义的Fiber是一个什么数据结构,源代码里的数据字段比较多,我这里就精简写出跟Fiber树相关的几个字段

每个Element元素对应到一个Fiber节点 ,通过return记录父节点,child记录第一个孩子节点,sibling记录下一个兄弟节点,这样原本的树结构就转换成Fiber树结构。

Fiber架构可以分3层

1、Scheduler(调度器)

它的核心是利用window.requestIdleCallback()这个方法(react团队对这个方法做了改造),它会在浏览器有空闲时间的时候执行对应的任务,这[……]

阅读全文

发表在 前端 | 标签为 , | 留下评论

React源码调试环境搭建

工程创建

源码下载

修改webpack配置

编译错误修改

结语

[……]

阅读全文

发表在 前端 | 留下评论