DevTools消息“Styles Invalidated”是什么意思？

Question

此消息是开发人员工具中的“重新计算样式”记录的说明 - ＆gt;时间表 - ＆gt;帧。我可以为此字符串找到的唯一搜索结果是对其在Webkit本地化源中的位置的引用。

我有一套非常流畅的60fps动画运行，除了偶尔出现的“样式无效”打嗝，偶尔消耗100 + ms。所述打嗝出现在两个地方之一，如DevTools时间轴图的悬停状态所示：

1）绿色摇滚时间轴，其播放头来回移动以控制屏幕上translateX'元素的动画。

2）直接在一小组旋转元素上设置变换的代码块：

while(i--) {
    gears[i].style['WebkitTransform'] = 'rotate3d(0,0,1,' + (delta * rotations[i]) + 'deg)';
}

这两个都是从requestAnimationFrame循环中调用的，代码中任何位置修改的唯一属性是变换rotate / rotate3d和translate / { {1}} / translateX（我已尝试使用和不使用3d）。

我还尝试禁用translate3d和translateX中的一个或另一个，但它们各自似乎仍然会导致问题。