※ ChatGPTを利用し、要約された質問です(原文:JavaScriptのsetTimeoutについて)
JavaScriptのsetTimeoutのタイマー処理についての調査結果
このQ&Aのポイント
JavaScriptのsetTimeout関数は、指定した時間(ミリ秒)後にコールバック関数を実行するタイマー処理を行います。
タイマー処理は、ブラウザごとに異なる実装があります。
Firefoxでは、setTimeoutのコールバック関数は専用のタイマースレッドで実行されるため、alert関数が呼ばれた際にもタイマーカウントが進行します。一方、IEやChromeでは、setTimeoutのコールバック関数はメインスレッドで実行されるため、alert関数を呼び出すとタイマーカウントが一時停止します。
JavaScriptのsetTimeoutについて
setTimeoutのタイマー処理の仕様を調べています。
var func = function () { alert(1); };
setTimeout(func, 1000);
alert(2);
このコードを実行した場合、alert(2)→alert(1)の順で処理されるのは当然ですが、
alert(2)を開いたまま1秒以上待ち、そこでOKボタンを押すとどうなるか、という問題です。
Firefoxの実装については下記ページで分かりました。
http://takoyakim.tumblr.com/post/10875885/firefox-settimeout
先ほどのコードの1000ミリ秒の経過処理は、タイマースレッドという専用スレッドで扱うため、
alert(2)で1000ミリ秒以上止めた後にOKボタンを押すと、即座にalert(1)が開きます。
しかしIEの場合はそうではなく、alert(2)を閉じてから約1000ミリ秒後にalert(1)が開きました。
alert(2)を開いたままどれだけ待機しても変わりません。
ChromeやSafariもIEと同じようです。
ですがこの結果は、次のコードの実行結果と矛盾してしまいました。
var heavyFunc = function () { for(var i = 0; i < 100000; i++) new Date(); }
var startTime = +new Date();
var callCount = 0;
var testFunc = function (x) {
heavyFunc(); // (1)
if (++callCount < 5) setTimeout(testFunc, 100);
else alert(+new Date() - startTime);
//heavyFunc(); // (2)
};
testFunc();
heavyFuncという重い処理を、setTimeoutの前後のどちらに置くかという実験コードです。
setTimeoutのタイマー処理がFirefoxのように別スレッドで実行されているのであれば、
先にsetTimeoutを呼び出してからheavyFuncを実行した方が速く処理が完了するだろう、という想定です。
そして結果は、FirefoxだけでなくIEとChromeでも先にsetTimeoutを呼んだ方が速い、となりました。
結局どのブラウザも専用のタイマースレッドを実装しており、
alert関数が特殊(タイマースレッドもブロックする)なだけ、ということなのでしょうか?
それとも私が何か見落としているのでしょうか。
お礼
ありがとうございます。 タイマースレッドについての挙動を調べて頂けなので、 ブラウザごとの相違がalertだけなら問題なしです。 実験ぐらいにしか使わないですし・・・