Style calculation

Style calculation сопоставляет CSS-правила с элементами, разрешает cascade и inheritance, вычисляет значения и инвалидирует затронутые поддеревья после смены class, attribute, media или stylesheet. В большинстве приложений важнее scope инвалидации, чем микрооптимизация селекторов, хотя широкие динамические селекторы усложняют прогноз.

					.theme-dark .card .title { color: var(--text); }
/* переключение .theme-dark может перекрасить много потомков */
				

Локальное владение — корни компонентов, layers и state-классы — сужает сюрпризы инвалидации. Профилирование полезнее переписывания каждого селектора.

На интервью: почему class на корне затрагивает множество потомков и как архитектура cascade снижает неожиданный пересчёт.

Типовые ошибки: микрооптимизация каждого селектора; глобальные селекторы и state-классы расширяют инвалидацию.

Компромисс: удобство против контроля — выбирайте механизм под вашу связность и бюджет производительности.

Чеклист:

• Знайте порядок cascade resolution.
• Следите за scope инвалидации при toggle class.
• Локальное владение стилями.
• Профилируйте до переписывания селекторов.