Google Chrome排字器驱动的动画受主线程阻塞的影响

Question

这是小提琴，显示了谜题：

https://jsfiddle.net/1rk65nxj/

我使用CSS动画来动画这个.spinner元素。元素本身被提升到自己的组合层，使用will-change: transform和translateZ(0)作为后备。

现在，我阻塞了主线程，做的事情如下：

var i = 999999; 

while ( i > 0) {
    i--;
}

由于CSS动画是由排序驱动的页面更新，我希望主线程阻塞不会停止旋转器，但它会停止。

现在，奇怪的是，如果我将元素的位置从相对绝对更改为绝对，主线程阻塞不会停止旋转器。

对于为什么position: absolute让动画合成器驱动而position: relative没有的原因有什么解释吗？

在谷歌Chrome版48.0.2564.116 (64位)上，Mac。

Answer 1

这似乎是Chrome中的一个bug。我已经在这里归档了：https://bugs.chromium.org/p/chromium/issues/detail?id=592803