React 本质【快速响应】
快速响应的制约因素有哪些:
- CPU瓶颈:当项目庞大,组件数量多,有很多大计算量的操作或设备性能不足,会导致
卡顿 - IO瓶颈:发送网络请求,由于等待数据返回才能进一步操作,导致不能快速响应,出现
白屏
React 15 架构【Stack Reconciler】
- Reconciler(协调器):负责找出变化的组件
- Renderer(渲染器):负责将变化的组件渲染到页面上
Reconciler采用的是递归的方式创建虚拟DOM,【递归过程不能中断】。如果组件树的层级很深,递归会占用线程的时间长,交互就会出现卡顿.
React 16架构【Fiber Reconciler】
- Scheduler(调度器):【调度任务的优先级】,高任务优先进入Reconciler
- Reconciler(协调器):负责找出变化的组件【更新工作从递归变成可以中断的循环过程,Recondiler内部采用Fiber架构】
- Renderer(渲染器):负责将变化的组件渲染到页面上