Самое важное про Event Loop

На занятиях мы подробно разбираем, что как работает. На этой странице я собрал материалы (статьи и видео), которые можно изучить, чтобы подготовиться.

Теоретический минимум (Junior)

• Что приводит к созданию тасок и микротасок
  • setTimeout
  • queueMicrotask
  • then/catch/finally
  • fetch
  • user events
• В каком порядке обрабатываются tasks, microtasks и таски requestAnimationFrame
• Что происходит на этапе рендеринга
  • Layout
  • Paint
  • Composite
• Уметь решать задачи
  • Задачи про промисы
  • Анимирование DOM-элементов через JS

Вопросы со звездочкой (Middle)

• Что такое Event Loop?
  • Дать определение без формулировки вида «это когда»
• Зачем нужны микротаски, если есть обычные таски?
  • Не рассказать, как оно работает, а объяснить, зачем так сделали
• Web Workers
• Event Loop в Node.js

Материалы

Рекомендую читать сверху вниз.

• 📙 Статья на MDN полезна как список используемых терминов
• 📺 Philip Roberts в 2014 году рассказывает про Event Loop до появления промисов
• 📺 Lydia Hallie про Event Loop — презентация в Apple Keynotes
• 📺 Lydia Hallie про промисы — презентация в Apple Keynotes
• 📺 Jake Archibald в 2018 году рассказывает про микротаски и requestAnimationFrame
• 📙 Никита Мостовой про Critical Render Path — статья на Хабре
• 📙 Никита Мостовой про этапы рендеринга — статья на Хабре
• 📺 Сергей Чикуенок в 2023 году рассказывает про особенности рендеринга (что вызывает перерисовки и как работает composing)
• 📙 Спецификация HTML5 про то, как работает Event Loop в браузере
• 📙 Event Loop в Node.js — описание на сайте Node.js