Прежде чем войти в цикл событий, вы должны знать о двух очередях, которые поддерживает движок Javascript.

Очередь макрозадач: все загружаемые сценарии, события от пользователей, исполняемый код и т. д. будут помещены в эту очередь. Используется подход «первым пришел – первым обслужен».

Очередь микрозадач: ее также называют очередью обещаний. Где все обещания в коде будут помещены в эту очередь.

Вот 3 шага, которые поток выполняет в JS.

1. Поток в JS проверяет, есть ли задача в очереди макрозадач. Если задачи нет, он будет следить за очередью для любых будущих задач. Процессорное время для этого наблюдения практически стремится к нулю.

2. Если в очереди есть какая-то задача, она ее выполнит. Затем он сразу же запускает очередь микрозадач в порядке FIFO, пока эта очередь не опустеет.

3. Затем, после того, как он отобразит DOM. Затем поток снова проверяет наличие задач в очереди задач макросов. Это означает, что он переходит к строке номер 1. Этот цикл называется циклом событий.

Алгоритм.

Пока( true) {
let task = macroTasks.pop();
if (task){
Запустить соответствующую задачу. Отправляйте все обещания туда, где об этом узнает поток.
while (microTasks.length) {
Завершите все обещания, когда они будут выполнены.
}
Визуализация DOM()

}