问题
We now all know, particularly from that nice article, that we should prefer css-transforms to animate position.
But we got the choice between translate() and translate3d()...
Which one is generally faster?
回答1:
This site below runs tests comparing translate(), translate3d(), and a couple other properties. According to it, translate3d() is faster in most browsers.
http://jsperf.com/translate3d-vs-xy
回答2:
The use of translate3d pushes CSS animations into hardware acceleration. Even if you're looking to do a basic 2d translation, use translate3d for more power! So 'T3d' is just better because it tells the CSS animations to push the animations in 3d power! That's why it is faster. (The answer of Cameron Little is the proof)
回答3:
As cameron suggested translate3d should be faster in a lot of browsers, mostly those that use gfx hardware acceleration to speed up rendering. especially on webkit translate3d was the prefered way of forcing hardware acceleration on page items.
though in mit experience sometimes there is one drawback to using 3d transforms - in certain browser-versions/os combinations (osx+safari i'm looking at you) hardware accelerated rendering can slightly alter font smoothing as well as interpolation thus causing minor flicker or blur. those situations can mostly be worked around but should be kept in mind.
来源：https://stackoverflow.com/questions/22111256/translate3d-vs-translate-performance