Неэффективные предложения селектора CSS

Question

У меня есть 2 вопроса о рефакторинге нашего устаревшего CSS для повышения производительности.

(1) Следующий связанный с принтером CSS включен в common.css, и некоторые элементы применяют селекторы Влияет ли это на производительность рендеринга в браузере? Другими словами, кроме печати страницы, используют ли браузеры CSS, чтобы проверить, соответствует ли элемент селекторам?

@media print
{
    body * {visibility:hidden}
    #xView, #xView * {visibility:visible; }
    #xView {position:fixed;}
}

(2) Как оценить улучшение производительности после повторного нанесения?

Спасибо.

Answer 1

Это не большой кусок кода, поэтому говорить о производительности немного нелепо, но все же - если вы используете селектор "*", это будет не очень быстро Было бы намного лучше, если бы вы установили видимость для одного контейнера, а не для каждого элемента внутри него.

По теме тестирования производительности - хорошее прочтение:

http://www.stevesouders.com/blog/2009/03/10/performance-impact-of-css-selectors/

http://blog.archive.jpsykes.com/151/testing-css-performance/

Вы также можете проверить время загрузки страницы в Firebug, но я не знаю, насколько точными будут результаты.

Answer 2

1: Нет, CSS print применяется только при печати, поэтому перед печатью не проверяется какой-либо код в их коде.

2: Для измерения производительности CSS посмотрите на это1004 * тестовая оснастка для CSS .