コールバックを登録して実行する系のブラウザAPIまとめ

「コールバックを登録して、それを適当なタイミングで実行する」系のブラウザAPIとして下記がある。これらを、MDNのドキュメントをもとに簡単にまとめる

setTimeout

指定秒数のタイマーをセットし、それがexpireしたらコールバックを実行する
第二引数に秒数をmsで指定するが、これは省略可能。省略した場合、0と解釈される。
実際のコールバックの実行タイミングが、指定秒数より遅れることがある。この理由としては下記のようなものがある
- ブラウザが他のタスクでbusyな場合、コールバックの実行が遅れることがある。setTimeoutで指定されたコールバックは、タスクキューに積まれるため。
- setTimeoutが5回以上ネストすると、4 msほどの遅延が生じる
- アクティブでないタブの場合は、負荷削減のために最短のタイムアウト秒数が決まってしまう。秒数はブラウザ依存で、firefox desktopとchromeは1秒。firefox androidは15分。
- firefoxは、さらに追加の色々な制限をかける。「tracking scripts」と判断したスクリプトに対して、スロットリングをかけることや、ロード中のタブのsetTimeoutのコールバック実行を遅らせることなど。

ブラウザがアイドル状態になったタイミングでコールバックを実行する。
アニメーションや、何かの入力にたいするレスポンスなど、優先度の高い処理に影響を与えず、優先度の低い処理をメインイベントループの中で行うのに使える
第二引数で、timeoutというオプションが指定できる。これを指定しておくと、その時間までにコールバックが実行されなかった場合、強制的にコールバックの実行をタスクキューに積む。
複数のコールバックがrequestIdleCallbackで登録されていた場合、通常はFIFOで実行される。(が、timeoutが指定されていた場合は順番が前後するケースもある)