1

Here is the fiddle showing the puzzler:

https://jsfiddle.net/1rk65nxj/

I am animating this .spinner element using CSS animation. The element itself is promoted to its own compositing layer using will-change: transform and translateZ(0) for fallback.

Now, i jam the main thread doing something like:

var i = 999999; 

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

Since CSS animations are compositor-driven page updates, I expected the main thread jam not to halt the spinner but it does.

Now, the weird thing is, if I change the position of the element from relative to absolute, the main thread jam does not halt the spinner.

Any explanation on why position: absolute makes the animation compositor-driven and position: relative not?

On Google Chrome Version 48.0.2564.116 (64-bit), Mac OS X El Capitan.

Prashant
  • 7,340
  • 2
  • 25
  • 24

1 Answers1

1

This appears to be a bug in Chrome. I've filed it here: https://bugs.chromium.org/p/chromium/issues/detail?id=592803

Paul Irish
  • 47,354
  • 22
  • 98
  • 132