I am trying to understand the requestAnimationFrame
api but I am not able to understand how repaint occurs during the process.
I am working on a programming exercise to create a stopwatch.
function startTimer() {
timerId = requestAnimationFrame(updateTimer);
}
function updateTimer() {
timer.textContent = updateTime();
timerId = requestAnimationFrame(updateTimer);
}
I understand that the requestAnimationFrame
tells the browser to call the callback function updateTimer
before the next browser repaint. But, I am assuming that the calculations inside the callback function updateTimer
are causing the repaint in the first place.
So, I am struggling to understand how the repaint is triggered in this scenario? Does requestAnimationFrame
triggers the repaint?