JavaScript イベントループ ビジュアライザー
コールスタック、タスクキュー、マイクロタスクキューで JavaScript イベントループを視覚化。
console.log("Start");
setTimeout(() => {
console.log("setTimeout");
}, 0);
Promise.resolve().then(() => {
console.log("Promise");
});
console.log("End");遅い速い
アイドルコールスタック
(空)
Web APIs / タイマー
(空)
マイクロタスクキュー
(空)
タスクキュー(マクロタスク)
(空)
(空)
コールスタック
マイクロタスクキュー
タスクキュー(マクロタスク)
Web APIs / タイマー
コンソール出力
JavaScript イベントループの理解
JavaScript イベントループは非同期操作を処理するメカニズムです。setTimeout コールバックはタスクキューに、Promise コールバックはマイクロタスクキューに入ります。
キーコンセプト
- コールスタックは同期コードを最初に実行
- マイクロタスクはマクロタスクより優先
- 各マクロタスクの後に全マイクロタスクが実行
- コールスタックが空の時のみキューをチェック
- Web API はメインスレッド外で実行
よくある質問
関連ツール
このツールを評価
3.8 / 5 · 109 件の評価
最新情報を受け取る
毎週の開発ヒントと新ツール情報。
スパムなし。いつでも解除可能。
Enjoy these free tools?
☕Buy Me a CoffeeHow to Use
- Enter or paste your data in the input field
- Configure any options if available
- Click the action button to process
- Copy the result to your clipboard
Use Cases
- Development and debugging workflows
- Data format conversion
- Code generation and formatting
- Quick calculations and validation