Beschrijf de reeks acties van de browser (en niet alleen de browser) na het invoeren van de URL en het aanvragen van de pagina. Wat is een forced layout?

После ввода URL и нажатия Enter браузер выполняет следующие шаги:

1. Разбор URL — выделяет протокол, домен, путь, параметры.
2. DNS-запрос — преобразует доменное имя в IP-адрес.
3. Установка TCP-соединения (и TLS, если HTTPS).
4. Отправка HTTP-запроса на сервер.
5. Получение HTTP-ответа с кодом состояния, заголовками и телом.
6. Парсинг HTML — браузер строит DOM-дерево.
7. Загрузка ресурсов — CSS, JS, изображения, шрифты и др.
8. Парсинг CSS — строится CSSOM (CSS Object Model).
9. Построение Render Tree — объединение DOM и CSSOM.
10. Layout (Reflow) — вычисление размеров и позиций элементов.
11. Paint — отрисовка пикселей на экране.
12. Выполнение JavaScript — может изменять DOM/CSSOM, вызывая повторные Layout и Paint.

Forced layout (принудительный layout) — это ситуация, когда браузеру приходится немедленно пересчитывать расположение элементов (layout), обычно из-за обращения к свойствам, требующим актуальных размеров (например, offsetWidth, clientHeight). Это блокирует поток выполнения и снижает производительность, так как браузер вынужден прервать текущие операции и выполнить перерасчет стилей и расположения элементов.

Избегать forced layout можно, минимизируя чтение свойств, вызывающих reflow, и группируя изменения DOM и стилей.