Does window.requestAnimationFrame perform threading?

Question

Does the window.requestAnimationFrame function create new threads to let the function where it's called and the function itself run parallel? Because I don't understand why the following code, doesn't result in a stack overflow.

window.requestAnimationFrame calls main and main calls window.requestAnimationFrame and so on ...

w.rAF -> main -> w.rAF -> main -> w.rAF . . .

main.js

function main(currentTime){
    window.requestAnimationFrame(main);
    console.log(currentTime);
}

window.requestAnimationFrame(main);

index.html

<script src="main.js"></script>

It's almost the same as if you used `setTimeout`. It's just a different queue. — marzelin, Sep 01 '20 at 13:02
Thank you, I understand it now. There was already a similar question online. Its just an async function call, im quite familiar with that because of flutter (dart). — tonik, Sep 01 '20 at 13:44

score 1 · Answer 1 · answered Sep 01 '20 at 12:53

1

No. Functions passed to requestAnimationFrame are queued, not threaded.

answered Sep 01 '20 at 12:53

Quentin

914,110
126
1,211
1,335

so why theres no stack overflow? I mean how the `console.log` line is reached then? – tonik Sep 01 '20 at 12:55
2

Putting a function on a queue isn't the same as calling the function. – Quentin Sep 01 '20 at 12:55

score 1 · Accepted Answer · answered Sep 01 '20 at 13:09

requestAnimationFrame tells the browser to run the function before the next frame is rendered. If you again call requestAnimationFrame in main it will put that function on the queue for the next (not the current) animationFrame.

In Javascript only workers are threaded.

requestAnimationFrame is a special function to execute code at the specific point in the Event Loop. I found this video quite helpful in explaining how the Event Loop works: https://www.youtube.com/watch?v=cCOL7MC4Pl0

Does window.requestAnimationFrame perform threading?

2 Answers2