Как рендерится страница в браузере

Процесс рендеринга страницы в браузере состоит из нескольких этапов: 1. **Парсинг HTML** – построение DOM-дерева 2. **Парсинг CSS** – построение CSSOM-дерева 3. **Создание Render Tree** – объединение DOM и CSSOM 4. **Layout (Reflow)** – расчет позиций и размеров элементов 5. **Paint** – отрисовка пикселей на экране 6. **Composite** – композиция слоев (если есть) Пример критического пути рендеринга: ```html

Hello World

``` Оптимизация рендеринга: - Минимизируйте CSS (удаляйте неиспользуемые стили) - Размещайте CSS в ``, а JS перед закрывающим `` - Используйте `defer`/`async` для скриптов - Избегайте синхронных макетных изменений (layout thrashing)