postTask：React的杀手锏被浏览器原生实现了？
大家好，我卡颂。
React这几年一直在完善的并发模式主要由以下两部分组成：
基于 fiber实现的可中断更新的架构基于调度器的优先级调度
可以说，从16年开始重构fiber架构到今年底（或明年初）React18发布正式版，这期间React团队大部分工作都是围绕这两点展开的。
如果现在告诉你，React呕心沥血多年实现的优先级调度，浏览器原生就支持，会不会很惊讶？
文章参考Building a Faster Web Experience with the postTask Scheduler。
什么是优先级调度
假设，我们有个记录日志的脚本需要在页面初始化后执行：
initCriticalTracking();
调用栈火炬图如下：
scheduler.postTask(() => initCriticalTracking());
Chrome实现的优先级调度API。scheduler.postTask属于试验功能，需要在 chrome://flags 中打开 #enable-experimental-web-platform-features
之前是如何实现优先级调度的
scheduler.postTask出现之前，通常使用浏览器提供的会在不同阶段调用的API模拟优先级调度，比如：requestAnimationFrame（简称rAF）一般用来处理动画，会在浏览器渲染前触发requestIdleCallback（简称rIC）在每一帧没有其他任务的空闲时间调用setTimeout、postMessage、MessageChannel在渲染之间触发
React使用MessageChannel实现优先级调度，setTimeout作为降级方案。API毕竟都有本职工作。用他们实现的优先级调度比较粗糙。
postTask Scheduler诞生了。postTask Scheduler的使用
scheduler.postTask有3种可选优先级:
// 默认优先级
scheduler.postTask(() => console.log('Hello, postTask'));
// 调用后延迟1秒执行，优先级最低
scheduler.postTask(() => console.log('Hello, postTask'), {
delay: 1000,
priority: 'background',
});
postTask建立在AbortSignal API上，所以我们可以取消尚在排队还未执行的回调函数。TaskController API控制：const controller = new TaskController('background');
window.addEventListener('beforeunload', () => controller.abort());
scheduler.postTask(() => console.log('Hello, postTask'), {
signal: controller.signal,
});
schedule.wait方法可以让我们轻松的等待某一时机后再执行任务。xxx.js：async function loadxxx() {
// 等待事件被派发
await scheduler.wait('myPageHasLoaded');
return import('xxx.js');
}
// 页面加载后派发事件
window.dispatchEvent(new CustomEvent('myPageHasLoaded'));
postTask的event配置项：scheduler.postTask(() => import('xxx.js'), {
event: 'myPageHasLoaded'
})
总结
资源提前、延后请求 第三方资源延迟加载
web应用复杂到一定程度时，出现了前端框架，开发者不用直接操作DOM。优先级。React现在在做的事么？
-
谷歌正酝酿安卓版 Chrome 新功能，提振浏览器启动速度
消息源 @Leopeva64 于 10 月 3 日在 X 平台发布推文，曝料称谷歌正酝酿安卓版 Chrome 浏览器更新，从而让其在低端设备上运行得更快、更流畅。 根据消息源分享的新截图，在最新安卓
-
谷歌Chrome浏览器登陆车机系统：首搭沃尔沃、极星等车型
随着互联网技术的发展，车载信息娱乐系统已经成为现代汽车的标配。然而，传统的车载信息娱乐系统往往功能单一，无法满足用户多样化的需求。CES 2024展览会上，谷歌宣布将Chrome浏览器集成至车机，这一
-
谷歌Chrome浏览器120稳定版发布 不再支持安卓 7.0！
今天，谷歌面向所有支持平台，发布了Chrome浏览器的120 稳定版更新，该版本不再支持安卓7.0/7.1系统。在新功能上，Chrome浏览器120稳定版推出一项新的“主动安全检查”功能，该功能会定期
关注公众号：拾黑（shiheibook）了解更多
赞助链接：
关注数据与安全，洞悉企业级服务市场：https://www.ijiandao.com/
四季很好，只要有你，文娱排行榜：https://www.yaopaiming.com/
让资讯触达的更精准有趣：https://www.0xu.cn/
关注网络尖刀微信公众号随时掌握互联网精彩
- gStore面向RDF知识图谱的原生图数据库系统
- 电脑硬盘数据丢失如何恢复？
- 量子计算产业与商业化发展将进入关键期！中美欧量子计算产业优势与特点
- 前端成功转型后端开发的机会在哪里；如何评价框架TailwindCSS；前端的未来是远程工作吗｜极客观点
- 【有料视频】Excel里最6的快捷键你知道吗？
- 日美两国承诺将加强在网络、航天及新兴技术等领域的合作
- 美国海军整合构想
- 淘宝内测微信支付！但需手动截图扫码
- 好玩，我看到了“元宇宙”的初级形态
- 《你好，李焕英》累计票房突破35亿；小米确定造车，或将由雷军亲自带队 | Do早报
- 京东正式成立京东科技子集团；特斯拉在华超级充电站突破700个；知情人士称蔚来固态电池供应商确为宁德时代【Do说】
- iPhone 12 Pro Max 动手玩：生产力野心“更大”了？
微信扫码关注公众号