[westoncb]

They also point out that substantial performance gains are given by using 'will-change,' as in the following.

  .app-menu {
	-webkit-transform: translateX(-100%);
			transform: translateX(-100%);
	transition: transform 300ms linear;
	will-change: transform;

}

And I'd point out that the authors are specifically stating that animating transform+opacity (via a 'transition') are more efficient than things like left, top, bottom, etc.—because those properties affect the layout stage, which is earlier than the composite stage (where the transform+opacity properties operate), and subsequent stages have to be recalculated.

They also discuss different ways of structuring DOM trees to create the same animation which have performance trade-offs.

[luke3butler]

Yep, the will-change was something new to me.