Comparison
requestAnimationFramevsrequestIdleCallback
requestAnimationFrame
you moved the animation out of `setInterval` and it finally stopped stuttering at odd moments.
A callback scheduled to run immediately before the next paint, at the display's refresh rate, and suspended entirely in a background tab. It is the correct place for any visual update driven by script, because the work lands in the same frame as the paint that shows it. It gives you the frame budget too: whatever the callback does, layout and paint still have to fit in the same sixteen milliseconds.
Full entry →requestIdleCallback
you deferred the analytics work until the browser said it had nothing better to do.
A callback run when the browser has spare time at the end of a frame, given a deadline it asks you to respect. It is right for genuinely optional work — prefetching, logging, warming a cache — and wrong for anything the user is waiting on, because a busy page may never go idle. Safari's support has lagged for years, so anything depending on it needs a timeout fallback.
Full entry →