likes
comments
collection
share

React技术揭秘学习-理念篇

作者站长头像
站长
· 阅读数 32

React技术揭秘学习-理念篇

React理念

使用JavaScript构建快速响应的大型Web应用程序的首选方式。制约网页快速响应的两类场景

  • CPU瓶颈
  • IO瓶颈

CPU瓶颈

主流浏览器的刷新时间是60Hz,即1000ms/60Hz=16.6ms刷新一次如果在16.6ms内需要渲染多个组件,GUI渲染线程JS线程互斥,执行顺序:JS脚本执行--->样式布局--->样式绘制如果JS脚本执行时间过长,超过16.6ms,就没有时间执行后面两个步骤。React解决方案:开启cocurrent Mode启用时间切片时间切片:在浏览器每一帧的时间,预留5ms(找到那段源码读懂贴上)给JS线程,将长任务分拆到每一帧中,如果预留的5ms不够用,react就把线程控制权交给浏览器使其渲染GUI,并继续等待下一个片段的到来。将同步更新变为可中断的异步更新(要写demo)


IO瓶颈

解决IO问题的方法是减少用户对网络延迟的感知度。React解决方案:suspense和useDefferedeValue(看看18版本中的修改,还没看完),同样将同步更新变为可中断的异步更新