Неоптимизированные селекторы. Браузер парсит CSS справа налево, поэтому сложные и избыточные селекторы, особенно с универсальным селектором * или селектором потомка >, замедляют вычисление стилей.
Большое количество правил @import в CSS. Они блокируют параллельную загрузку стилей, что задерживает рендеринг страницы.
Использование сложных или ресурсоемких CSS-свойств, таких как тени (box-shadow, text-shadow) или размытие (filter: blur), при анимации или большом количестве элементов.
Неразборчивый или избыточный CSS, написанный без учета специфичности и наследования, приводящий к перезаписи правил и увеличению размера файла.
Неиспользуемый CSS ("dead CSS") — правила, которые не применяются к текущей разметке. Увеличивает размер файла и время парсинга.
Фоновые изображения большого размера или в неподходящем формате, которые загружаются медленно и блокируют рендеринг.
Использование фреймворков, которые добавляют много неиспользуемых стилей.
Плохо спроектированный макет (layout) с избыточным количеством элементов или глубокой вложенностью, что увеличивает время перерисовки (repaint) и перекомпоновки (reflow).
Неправильное использование will-change — может привести к излишнему потреблению памяти GPU или ненужному созданию слоев.
Отсутствие сжатия (Gzip или Brotli) при передаче CSS-файлов с сервера.