React学习笔记:调度器(Scheduler)- 时间切片

本文介绍了React中的调度器Scheduler,特别是时间切片的概念。通过分析isInputPending、setImmediate等调度策略,以及MessageChannel和setTimeout的使用,阐述了如何在保证响应性的前提下,优化长时间运行任务的执行。此外,还详细讲解了切片时间、任务拆分、挂起、恢复和终止等关键点,展示了React如何高效地处理更新和渲染。
摘要由CSDN通过智能技术生成

react版本: 18 Alpha

浏览器每一帧需要执行的任务

切片调度

下面是react源码中的几种调度方式,有先后关系

方式一:isInputPending

参考文档:https://wicg.github.io/is-input-pending/

在运行需要显示某些内容的脚本时,开发人员今天需要做出判断。

如果脚本可能计算很长时间才能运行并且用户在发生这种情况时进行了某种输入,那么浏览器将需要等到脚本完成后才能分派输入事件。这会造成在响应输入事件之前有很长的延迟,用户体验并不是很好,因此开发人员通常会将长脚本任务分解成更小的块,以允许用户代理在块之间调度事件。每次脚本执行时,它都需要以某种方式发布一条消息,调用 requestAnimation 帧和 requestIdleCallback 的组合,或者采用其它方式来生成可以被调度的事情,之后它可以在空闲时再次被调用。即使在最好的情况下,脚本每次产生时也可能需要很多毫秒才能再次运行。所以不幸的是,这也不是一个很好的用户体验,因为部分初始的脚本被延迟了很久才执行,尽管他需要这么久的时间。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值