CODEWITHSUNDEEP
javascripthtmlcssanimationcss-transitions
NaNa
NaNa

Reputation: 76

When to use requestAnimationFrame? and why we need requestAnimationFrame if we have css transition?

I don't know When to use requestAnimationFrame. If requestAnimationFrame and css both can satisfy my needs, which one should I choose?

can you show me some of your Applied Cases?

thx very much~

Upvotes: 2

Views: 2463

Answers (1)

Cezar Augusto
Cezar Augusto

Reputation: 9892

I think the only reason to opt for requestAnimationFrame over CSS animations is when you want to do quick animations where you need to ensure that browsers would make it smooth. Animations like jump, stop, pause, return could benefit from using requestAnimationFrame.

The thing is that requestAnimationFrame uses no CPU power, and only draws animation that would be visible to the user (it doesn't consume anything if you swich tabs, minimize, etc). Frames would be only drawn when the browser is ready and since there are no ready frames waiting to be drawn, there are no unnecessary frame draws. So, for smoothness guarantee, you can safely opt for requestAnimationFrame.

If you plan something simple that doesn't fit the above explanation, then requestAnimationFrame is overkill and you'd better switch to CSS animations.

Source consulted:

https://dev.opera.com/articles/better-performance-with-requestanimationframe/

Upvotes: 2

Related Questions