Okay, two more questions:
1) Suppose I animate a simple div with only text and no special CSS effects. However, the parent or a sibling of the div has things like text-shadow, box-shadow, and gradient. What does your browser need to do? Does it still need to do the layout, paint, and composite operations?
2) How can we compare the browser performance of a translation for the following things:
a) a box with text, background color, curved border, text-shadow, box-shadow, and gradient
a box with only text, background color, and curved border
c) an image with the same contents as (a)