Fiber结构

Fiber, 利用时间片的概念，将任务分解为多个单元任务，链表结构

// react/packages/react-reconciler/src/ReactFiber.js
type FiberRoot {
  containerInfo: root节点
  current: Root Fiber 当前对应的fiber根节点
  finishedWork：已经完成的FiberRoot, 在commit 阶段处理
  context: 顶层上下文
  expirationTime：过期时间
}

type Fiber {
    tag: WorkTag // 不同的组件类型 FunctionComponent 0/ ClassComponent 1/  HostRoot 3, HostText 6, HostComponent 4 ...
    key:  ReactElement上的key
    elementType: 元素类型 ReactElement.type
    stateNode: dom节点
    return:  父节点
    child: 子节点
    sibling: 兄弟节点
    pendingProps: 新的props
    memoizedProps: 上一次的props
    updateQueue: fiber对应的组件产生的update都会放入这个队列中
    memoizedState: 上一次的state
    effectTag: 副作用标记
    firstEffect: 子树中第一个需要变更的fiber
    lastEffect: 子树中最后一个需要变更的fiber
    expirationTime: 过期时间
    alternate: 上一次的fiber
}

// react/packages/react-reconciler/src/ReactUpdateQueue.js
type Update<State> {
  expirationTime: 
  tag: 更新类型
  payload: any setState接收的第一个参数
  callback: setState接收的第二个参数
  next：下一个Update
  nextEffect: Updte<state>
}

type UpdateQueue<State> {
  baseState: State 每次操作完更新后的state
  firstUpdate: 第一个update
  lastUpdate: 最后一个update
  firstEffect: Update<State> 第一个副作用
  lastEffect: Update<State>
}