requestIdleCallback 在 Safari 里为啥不生效？

Dev · 心虹提问于 2026-03-13 06:39:21 阅读 68

优化

我在项目里用 requestIdleCallback 做非关键任务的延迟执行，Chrome 跑得好好的，结果 Safari 上完全没反应，控制台也没报错。

查了下发现 Safari 好像一直没支持这个 API？那我是不是得加个 polyfill？但不确定怎么判断兼容性，或者有没有更稳妥的替代方案。

现在代码是这样写的：

if (window.requestIdleCallback) {
  requestIdleCallback(() => {
    console.log('执行低优先级任务');
  });
} else {
  setTimeout(() => {
    console.log('降级执行');
  }, 0);
}

我来解答赞 8 收藏

反馈

1 条解答

一艳雯 Lv1

Safari 确实一直没支持这货，你那段代码还有个 bug——检查了 window.requestIdleCallback 但调用时没写 window。

直接上 polyfill，放到代码最前面：

window.requestIdleCallback = window.requestIdleCallback || function(cb) {

  const start = Date.now();

  return setTimeout(() => {

    cb({

      didTimeout: false,

      timeRemaining: () => Math.max(0, 50 - (Date.now() - start))

    });

  }, 1);

};



window.cancelIdleCallback = window.cancelIdleCallback || function(id) {

  clearTimeout(id);

};

这样就能统一调用 requestIdleCallback 了，Safari 会自动走 polyfill，Chrome 原生支持的不受影响。试试看。

2026-03-13 07:00