La tua milizia cambierà sempre tra diversi browser. Non penso che tu possa dire con precisione che una soluzione sarà sempre il miglior cross browser, ma su cosa puoi fare affidamento, è che qualsiasi cosa che usi la tua GPU sarà sarà più veloce. Quando esegui l'animazione utilizzando un setTimeout, il browser esegue tutto il crunch in memoria e attraverso la CPU. Inoltre, in realtà non sa che l'animazione prevista è prevista per essere liscia.
A seconda della versione del tuo browser, troverai anche che l'accelerazione della GPU può essere approssimativa. Ad esempio, fino allo scorso anno, un trucco comune per garantire che i browser basati sul webkit usassero sempre l'accellerazione GPU dovevo fare una sorta di "suggerimento tipo" in cui avresti impostato la proprietà come -webkit-transform: translateZ(0)
Un altro punto da aggiungere, tuttavia, è che cosa significa in realtà "performante" per te? Significa visivamente performante, il che significa liscio? In tal caso non si vorrebbe usare setTimeout, perché non è possibile ottenere realisticamente quella "levigatezza". Quindi, ove possibile, si vorrebbe utilizzare la transizione attraverso i CSS (e fare affidamento sull'accellerazione GPU dove disponibile).
Ma cosa intendi per "performante" in termini di durata della batteria del tuo dispositivo. In tal caso, probabilmente vorrai usare requestAnimationFrame .
Perché dovrei usarlo?
The browser can optimize concurrent animations together into a single
reflow and repaint cycle, leading to higher fidelity animation. For
example, JS-based animations synchronized with CSS transitions or SVG
SMIL. Plus, if you're running the animation loop in a tab that's not
visible, the browser won't keep it running, which means less CPU, GPU,
and memory usage, leading to much longer battery life.
Riferimento: requestAnimationFrame for smart animating
Avanti, "performante" potrebbe significare tempo speso per te. Lo so personalmente, posso essere il più performante se uso le animazioni CSS e le uso laddove possibile.
Questo articolo sarà una lettura utile per te:
link