requestAnimationFrame
setTimeout
や
setTimeInterval
のような時間指定の関数を使ってアニメーションを実装するとブラウザのフレーム(画面)を更新するタイミングでも関係なく実行されます。その結果、フレーム更新とJavascriptの実行が重なり、フレームレートの低下をもたらします。
requestAnimationFrame
はブラウザにとって最適なタイミングで実行される!
参考 :
requestAnimationFrameの仕組みと使い方!うまく使ってパフォーマンスを改善しよう!