0

Currently i have 2 animations in two rAF loops. For performance reasons i'm considering moving both to 1 loop. The constantly running animation is a small 3d wireframe in the site header, this is not stoppable and is present the moment the site is loaded. However i also have oscilloscopes and spectrum analysers that are only requesting animation frames when audio is played. The moment i pause, cancelAnimationFrame is called.

I have read that 1 rAF is usually better, but i'm having some second thoughts how i should achieve this. Should the constantly running rAF loop check 60 times a second for a variable having a boolean value, and when the value is true it should also run a function that holds the user triggered animations? Or are there any better solutions? What are your experiences?

dekztah
  • 373
  • 7
  • 17
  • 1
    If you have already a non-stop rAF loop for the wireframe, adding a check for a boolean value it won't be an issue in term of performance; and it's probably better than two rAF loop. Saying that, unless you have already some performance specific issue, I don't see problem with both approaches for your case. – ZER0 Mar 19 '15 at 16:05
  • ok, i have implemented it. the results are better on a low end machine than before. some machines with no GPU tend to choke on canvas and webGL rendering, eventhough they could play 1080p video seamlessly. thanks for the confirmation, much appreciated! – dekztah Mar 19 '15 at 19:30
  • One rAF is usually better. You can use multiple javascript objects which drive animations in a single requestAnimationFrame. Here's a demo: http://stackoverflow.com/questions/27982470/how-to-control-animation-speed-requestanimationframe/27988973#27988973 – markE Mar 20 '15 at 18:07

0 Answers0