requestAnimationFrame
Ein Web-API, um eine Funktion kurz vor dem nächsten Neuzeichnen des Browsers auszuführen, synchron zur Bildwiederholrate des Bildschirms. Der richtige Weg für flüssige JavaScript-Animationen — statt setTimeout/setInterval.
Problem: Animieren mit setInterval(fn, 16) ist unzuverlässig — das Intervall synchronisiert sich nicht mit dem Bildschirm, wodurch Frames springen oder doppelt erscheinen, und Animationen verbrauchen weiter CPU-Zeit, selbst wenn der Tab unsichtbar ist. requestAnimationFrame(callback) bittet den Browser, den Callback kurz vor dem nächsten Frame auszuführen, im Takt des Bildschirms (60 Hz, 120 Hz, was auch immer verbaut ist) → flüssige Animation, und pausiert automatisch, sobald der Tab nicht sichtbar ist (spart Akku und CPU). Muster: Der Callback animiert einen Schritt und ruft für den nächsten Frame erneut rAF auf — eine mit dem Bildschirm synchronisierte Schleife. Einsatzzweck: alle JS-getriebenen Animationen, Spiel-Loops, sanftes Scrollen, Canvas-Rendering. Ergänzung: requestIdleCallback für nicht-dringende Arbeit. Faustregel: wenn möglich mit CSS animieren (noch billiger), aber sobald JS gebraucht wird, ist rAF das richtige Werkzeug.