DEV Community

Patricia Nicole Opetina
Patricia Nicole Opetina

Posted on • Updated on

requestAnimationFrame in Javascript

[JS #1 WIL Post]

I was doing my tic-tac-toe project when I stumbled upon requestAnimationFrame in javascript. At the initial stages of my development, I was using window alerts to broadcast the winner of the game. But then I stumbled on one problem: the winner is broadcasted before the winning move is rendered in the board. After thorough searching, the answers I can find in the web is all about using setTimeOut to delay the alerts. I decided to ask for some help in stack overflow and learned a lot from the answer.

I started digging about request animation frame in javascript. Basically window.requestAnimationFrame() is used if you want to manually tell the browser to update the UI before the next repaint. This method takes a callback function which is invoked before the repaint. More information can be found in its comprehensive MDN docs.

This is my first time hearing about this window.requestAnimationFrame function ever since I started learning js, around two years ago. Thank you to that SO user for the very insightful answer :).

Top comments (0)