Что такое CSSOM

CSSOM (CSS Object Model) — это API, представляющее CSS в виде дерева объектов, аналогично DOM. Браузер парсит CSS и создаёт CSSOM, который используется вместе с DOM для формирования Render Tree.

Ключевые особенности:

• CSSOM содержит стили, которые можно динамически изменять через JavaScript
• Имеет иерархическую структуру (правила наследования)
• Доступен через document.styleSheets

Пример работы с CSSOM:

// Получить все стили документа
const styles = document.styleSheets[0];
// Добавить новое правило
styles.insertRule('body { background: red; }', 0);
// Удалить правило
styles.deleteRule(0);

CSSOM строится параллельно с DOM, но рендеринг страницы блокируется до полного формирования CSSOM (Critical CSS).