2023-04-11 · JavaScript

搞懂 JavaScript 的事件循環

追蹤一個任務如何從呼叫堆疊、微任務佇列,最後排到畫面上。

前言

setTimeout(fn, 0) 不是零秒,await 也不是魔法。這篇文章用圖解與小型實驗,帶你看任務(task)、微任務(microtask)與瀏覽器繪製如何交錯執行。

核心智模型

  • 從最小、能運作的版本開始,並讓它可觀測。
  • 把你正在承擔的取捨寫下來,而不只是寫下你交付了什麼功能。
  • 團隊規模改變時重新檢視決策;JavaScript 的多數選擇都有保存期限。

實作起點

  1. 在實驗分支重現情境,並放在你信任的量測指標旁邊。
  2. 一次只改變一個變數,讓 diff 小到能用一句話解釋清楚。
  3. 保留成果、丟掉腳手架。
Terminal window
git switch -c experiment/one-thing

結語

這裡沒有教條。把它當成一份你有權不同意的檢查清單——最好附上你自己的實驗結果。