requestAnimationFrame
API przeglądarki planujące wykonanie funkcji tuż przed następnym odświeżeniem ekranu, zsynchronizowane z jego częstotliwością. Właściwy sposób na płynne animacje w JavaScripcie — zamiast setTimeout/setInterval.
Problem: animowanie przez setInterval(fn, 16) jest zawodne — interwał nie jest zsynchronizowany z odświeżaniem ekranu, więc klatki przeskakują lub się dublują, a animacja zużywa procesor nawet wtedy, gdy karta jest ukryta. requestAnimationFrame(callback) prosi przeglądarkę o uruchomienie funkcji tuż przed następną klatką, w rytm ekranu (60 Hz, 120 Hz — jakikolwiek jest), dzięki czemu animacja jest płynna i automatycznie się wstrzymuje, gdy karta nie jest widoczna (oszczędza baterię i procesor). Wzorzec: callback wykonuje jeden krok animacji i ponownie wywołuje rAF — pętla zgrana z ekranem. Zastosowania: wszystkie animacje sterowane z JS, pętle gier, płynne przewijanie, rysowanie na canvasie. Uzupełnienie: requestIdleCallback dla pracy niepilnej. Zasada kciuka: jeśli się da, animuj w CSS (jeszcze taniej), ale gdy potrzebny jest JS, rAF jest właściwym narzędziem.