Having read Kirupa’s article on web animations I am attempting to use element.animate() . What I am wondering is about the screen refresh. Should I be using the requestAnimationFrame() method within my animate function, or does the animate method use a built in call to the browser to repaint before executing the animation?
Hi, bstagy!
The animate method uses its own built-in ways of updating the screen, but it should be as good (if not better) than requestAnimationFrame. Take a look at the source here: http://www.kirupa.com/html5/examples/wa_multiple_simple.html Notice that there is no additional code to update the refresh outside of just calling the animate method.
Cheers,
Kirupa 
This is awesome Kirupa! To be honest I was really struggling with the requestAnimationFrame method because of the math. Thank you!
1 Like
The math can get pretty complicated with requestAnimationFrame 
One thing to add. Because the animate method is still really new, its support across browsers is really low. You should use this polyfill to make up for that gap: https://github.com/web-animations/web-animations-js
Cheers,
Kirupa
I see…so all I need to do is link to the js file and it will fallback to the library if my animations aren’t supported in older browsers. Thank you!
btw…enjoying reading your book JS 101. I’ve been trying to learn JS for years, but it’s only recently that I’m just starting to be able to be functional (no pun…) with it. And your insight’s are helping to fill in the gaps.
1 Like
