Menu
I am just trying to understand why the hell window.requestAnimationFrame is accepting the second parameter as an element, what is the reason behind that?
I am curious to know the underlying execution for this function....
997
requestAnimationFrame returns an ID you can use to cancel it, just like setTimeout or setInterval does. jQuery used here only to demonstrate a simple animation and bind events.
To optimize system and browser resources, it is recommended to use requestAnimationFrame , which requests the browser to execute the code during the next repaint cycle. This allows the system to optimize resources and frame-rate to reduce unnecessary reflow/repaint calls.
requestAnimationFrame() method tells the browser that you wish to perform an animation and requests that the browser calls a specified function to update an animation before the next repaint. The method takes a callback as an argument to be invoked before the repaint.
As now you know that the rAF is a Web API, that means the callback will be called asynchronously. Unlike setInterval , requestAnimationFrame does not accept delay argument, instead, it only calls the callback function when the browser is ready to perform the next paint operation.
It's added so that when an element is out of view (because of scrolling for example), the animation is not run.
From the specs:
Editorial note
ISSUE-4 Do we want to allow an Element to be passed to requestAnimationFrame, so that animations affecting the given element are throttled or paused when scrolled out of view?
More information about this issue can be found here.
157
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
