使用 requestAnimationFrame 循环处理点击等事件

Question

我在项目中使用 requestAnimationFrame，我需要根据用户输入触发某些音频和视频事件。当我收到输入时，我会缓存要在下一次传递期间呈现的信息 requestAnimationFrame 并继续进行处理以立即呈现音频事件。

我的问题是：音频输出的信息处理是否会延迟视觉渲染并导致卡顿？例如，如果...

• 鼠标点击发生在时间戳 15 毫秒；
• requestAnimationFrame 的下一次传递计划在 16 毫秒（即点击后 1 毫秒）发生；和
• 处理鼠标点击以进行音频渲染需要 5 毫秒；

会处理鼠标点击音频渲染，时间戳20ms结束，requestAnimationFrame延迟5ms执行？或者 requestAnimationFrame 运行 在不受事件循环中发生的事情影响的单独线程上？

谢谢！

Answer 1

不，requestAnimationFrame(rAF) 不能在其他线程上工作，所以是的，如果事件循环中的任务很长，它将延迟事件循环中发生的所有其他事情，包括rAF。不过不用担心，你的 rAF 回调也需要一些时间来执行，如果你的点击处理程序真的只需要 1ms，它不会被注意到。