如何在Chrome时间轴中查找导致“拉伸框架”的内容？

Question

我正在尝试在浏览器应用中优化Javascript，以确保动画始终以60fps运行。我正在使用Chrome（57）时间轴工具分析瓶颈。许多都是可以解决的，但我也遇到了一些非常神秘的现象：

下面的屏幕截图显示了一个空的时间轴（在长时间运行的CSS转换期间），但帧仍超过16毫秒。我在哪里可以找到那里发生的事情？

另一个奇怪的现象如下所示，其中函数逻辑的一部分已被移入requestAnimationFrame（）语句中。这个逻辑很好地在时间上移动得很好，似乎仍然将整个帧延伸到21.3ms。为什么会这样？

我希望有人可以对这些案件有所了解。

谢谢！

帕斯卡