React 18中,引入了一个新概念——transition,由此带来了一个新的API——startTransition和两个新的hooks——useTransition和usedeferredValue。
1)transition产生初衷
transtion 直接翻译为 过渡。tansition本质上是为了解决渲染并发问题所提出。在React中一旦组件状态改变并触发了重新渲染,则无法停止渲染。直到组件重新渲染完毕,页面才能继续响应用户的交互。
为此react 18中更新都可以划分为以下两类:
- 紧急更新(urgent update):用户期望马上响应的更新操作,例如鼠标单击或键盘输入。
- 过渡更新(transition update):一些延迟可以接受的更新操作,如查询时,搜索推荐、搜索结果的展示等。