我正在使用 chrome 中的 requestAnimationFrame 在 raphael 中运行一个简单的视图框动画。我注意到所有脚本和渲染任务都已完成，但我仍然看到 30 到 60 毫秒之间的任何“死区”，看起来浏览器似乎无所事事。对此有任何见解吗？
【问题讨论】：
标签： google-chrome timeline requestanimationframe
我继续这个问题寻找相同的答案，但似乎没有人提供答案，这就是我发现的。
根据the Chrome DevTools documentation about the Clear and Light Grey Frame，空格是你的浏览器空闲的时间。
为什么闲置？
简短的说法是，空心框架意味着以下两种情况之一：您的 javascript 主线程正忙于处理 Chrome 开发团队忘记在 DevTools 中显示的其他事情，或者您的 GPU 遇到了瓶颈。
为了区分，您可以在 DevTools 的设置中启用“时间轴：在标尺上显示 CPU 活动”（您知道，右下角的齿轮）。
你会以这样的方式结束：
看到“记录”行上的深灰色小块了吗？当渲染器线程忙时，这些是黑暗的。如果渲染器线程大部分是空闲的，例如没有黑块，就像我为这篇文章截取的屏幕截图一样，这是一个很好的信号，表明您受 GPU 限制。
【讨论】：
以下是 Chrome 工程师 Nat Duca 的完整解释。
【讨论】：