CODEWITHSUNDEEP
cssanimationcss-transitions
Stefan
Stefan

Reputation: 327

Do CSS3 animations need to be paused in hidden state to reduce CPU load?

Simple question: do CSS3 animations need to be paused to reduce CPU load, especially if it was hidden at some point? To explain this a bit more: I have an application which contains different divs (= pages), and one of them has an endless running pulsar animation over a google maps section.

Now I was wondering if this will strain battery life noticably on mobile devices even if the animation is not visible (= container div hidden). For a desktop it seems to make no difference according to the OS X activity monitor, but I have no clue how mobile devices (Android & iOS) behave here.

Perhaps anyone has already investigated this in the past?

Upvotes: 1

Views: 133

Answers (1)

MattDiamant
MattDiamant

Reputation: 8771

According to the spec, animations are terminated on display: none, so they should not be running at all. If you're using visibility: hidden, they will still run. So, just make sure it's display: none.

https://www.w3.org/TR/css3-animations/

Upvotes: 2

Related Questions