说说你对fiber架构的理解？解决了什么问题？

Fiber 架构是 React 16 引入的一种新的协调算法，用于实现虚拟 DOM 的增量渲染。它解决了 React 在处理大型应用或复杂组件树时可能遇到的性能问题和用户体验问题。

主要问题和解决方案：

1. 增量渲染：

   • 问题： 旧的栈调度算法在进行渲染时是同步递归的，如果渲染操作过于耗时，会导致页面在渲染过程中出现卡顿或者无法响应用户交互。
   • 解决方案： Fiber 架构采用了一种可中断的、优先级调度的方式。它将渲染任务分解为多个小任务单元，通过优先级调度器来决定每次处理的优先级，使得浏览器在空闲时可以中断当前任务，执行更高优先级的任务，从而实现更流畅的用户体验。

2. 异步渲染：

   • 问题： 传统的同步渲染方式会阻塞主线程，导致页面响应变慢。
   • 解决方案： Fiber 架构支持异步渲染，可以根据优先级将工作分解成多个步骤，并且可以在不同的帧之间分配这些工作。这样可以避免阻塞主线程，提高页面的响应速度。

3. 可中断和恢复的渲染过程：

   • 问题： 传统的渲染过程是不可中断的，一旦开始就要一直执行完毕。
   • 解决方案： Fiber 架构允许渲染过程中断，并且可以保存当前的状态，待下次继续渲染时恢复状态。这种能力使得 React 可以根据用户交互、网络状态等动态调整渲染优先级，以提升整体的响应性能和用户体验。

4. 更精细的控制和调度：

   • 问题： 传统的调度算法难以精确地控制和调度不同类型的更新（如动画、用户输入、数据变更等）。
   • 解决方案： Fiber 架构引入了更细粒度的优先级控制和调度策略，可以根据不同任务的优先级和类型来调整渲染顺序，确保高优先级的任务优先执行，从而提高应用的响应性和流畅度。

总体来说，Fiber 架构通过引入新的调度算法和渲染机制，解决了 React 在处理大型应用和复杂交互时可能遇到的性能问题，显著提升了 React 应用的渲染效率和用户体验。