JavaScript działa na pojedynczym wątku, więc może robić tylko jedną rzecz naraz. Event loop to to, co pozwala mu obsługiwać pracę asynchroniczną bez blokowania: uruchamia stos wywołań, a gdy stos jest pusty, pobiera callbacks z kolejek.
Istnieją dwie kolejki o różnych priorytetach:
.then), queueMicrotask. Opróżniane całkowicie po każdym zadaniu, przed renderowaniem.setTimeout, I/O, UI events. Jedno jest przetwarzane na iterację pętli.console.log("1"); // sync
setTimeout(() => console.log("2"), 0); // macrotask
Promise.resolve().then(() => console.log("3")); // microtask
console.log("4"); // sync
// Output: 1, 4, 3, 2
1, 4.3.2.Dlatego Promise.then zawsze uruchamia się przed setTimeout(…, 0), chociaż oba są "async" — microtasks mają priorytet.
// ❌ blocks the single thread — UI freezes for 5 seconds
while (Date.now() - start < 5000) {}
Długa praca synchroniczna blokuje wszystko (renderowanie, kliknięcia). Przenieś ciężkie obliczenia CPU do Web Workera (prawdziwego oddzielnego wątku).
Zrozumienie pętli wyjaśnia porządek async, dlaczego promises rozwiązują się przed timerami i dlaczego nigdy nie należy blokować główny wątek — centralny model myślowy dla całej asynchronicznej JavaScript.