参加大崔老师（阿崔cxr）的 mini-react 课程感悟
最大体验就是，短短几百行代码需要反复阅读
一步步从操作dom元素到处理fc逻辑，到处理更新逻辑、监听逻辑
后面理解了fiber的链表结构就能对后续内容更清晰理解
一、初始化逻辑
1、如何根据fc构造react的单链表数据结构
链表中 A 遍历child节点到 G 时，G 没有 sibling 节点，向父级（D）递归查找 sibling 节点，获取到 F，同理 F 向上查找到 C。构造成一个单链表数据，用于初始化与更新
//单个fiber结构
newFiber = {
type: child.type,
props: child.props,
child: null,
parent: fiber,
sibling: null,
dom: null,
effectTag: 'placement',
}
2、dom统一添加
再构建完链表之后，根据链表树进行遍历，构造 dom元素，添加到 root 节点
3、事件添加
//事件存储在props中
props：{
onClick: ƒ handleClick()
}
在上一步时，判断属性中的key是否为on开头，/^on/.test(key)
给dom 添加事件
const eventType = key.substring(2).toLocaleLowerCase()
dom.addEventListener(eventType, nextProps[key])
// eventType = click
// nextProps[key] = handleClick()
4、dom 更新
触发更新之前，把当前的 fiber 存储到 newfiber.alternate 属性上
在添加dom元素时，判断类型是否相同
(1)old有，new无，去删除
(2)old无，new有，去添加
(3)old有，new有，去修改
5、任务调度器
管理和调度组件的更新和渲染
使用 requestIdleCallback 实现
每次执行时判断工作单元是否有值
工作单元会在初始化和更新后赋值
构造完fiber树后设为空
执行完初始化或者更新后
工作循环不再执行
