面试官: 说说对Fiber架构的理解?解决了什么问题?

type Fiber = {
  // 用于标记fiber的WorkTag类型, 主要表示当前fiber代表的组件类型如FunctionComponent、ClassComponent等
  tag: WorkTag,
  // ReactElement里面的key
  key: null | string,
  // ReactElement.type, 调用`createElement`的第一个参数
  elementType: any,
  // The resolved function/class/ associated with this fiber.
  // 表示当前代表的节点类型
  type: any,
  // 表示当前FiberNode对应的element组件实例
  stateNode: any,
 
  // 指向他在Fiber节点树中的`parent`, 用来在处理完这个节点之后向上返回
  return: Fiber | null,
  // 指向自己的第一个子节点
  child: Fiber | null,
  // 指向自己的兄弟结构, 兄弟节点的return指向同一个父节点
  sibling: Fiber | null,
  index: number,
 
  ref: null | (((handle: mixed) => void) & { _stringRef: ?string }) | RefObject,
 
  // 当前处理过程中的组件props对象
  pendingProps: any,
  // 上一次渲染完成之后的props
  memoizedProps: any,
 
  // 该Fiber对应的组件产生的Update会存放在这个队列里面
  updateQueue: UpdateQueue<any> | null,
 
  // 上一次渲染的时候的state
  memoizedState: any,
 
  // 一个列表, 存放这个Fiber依赖的context
  firstContextDependency: ContextDependency<mixed> | null,
 
  mode: TypeOfMode,
 
  // Effect
  // 用来记录Side Effect
  effectTag: SideEffectTag,
 
  // 单链表用来快速查找下一个side effect
  nextEffect: Fiber | null,
 
  // 子树中第一个side effect
  firstEffect: Fiber | null,
  // 子树中最后一个side effect
  lastEffect: Fiber | null,
 
  // 代表任务在未来的哪个时间点应该被完成, 之后版本改名为 lanes
  expirationTime: ExpirationTime,
 
  // 快速确定子树中是否有不在等待的变化
  childExpirationTime: ExpirationTime,
 
  // fiber的版本池, 即记录fiber更新过程, 便于恢复
  alternate: Fiber | null,
}

// 指向父级Fiber节点
this.return = null
// 指向子Fiber节点
this.child = null
// 指向右边第一个兄弟Fiber节点
this.sibling = null