Насколько медленны медиа-запросы CSS?

Когда я упорядочиваю свой CSS, мне нравится сохранять связанные стили (стили заголовков находятся в одном разделе, стили нижнего колонтитула — в одном месте и т. д.) (извините, сторонники OOCSS).

Недавно я экспериментировал с медиа-запросами для маленьких/больших экранов. Чтобы придерживаться моей организационной схемы, мне пришлось бы включать отдельные запросы для каждого размера экрана, на который я ориентируюсь, с каждым разделом кода. (Так, например, если бы я поддерживал, например, семь разных размеров экрана, у меня было бы семь разных медиа-запросов с моим «заголовком» CSS, а затем семь запросов в разделе «нижний колонтитул» и т. д.)

Оставляя в стороне вопрос о том, должен ли я это делать, есть ли какие-либо технические последствия наличия такого большого количества блоков медиа-запросов? (Они все либо min-width, либо max-width, либо оба. Скажем, у меня было 100 различных запросов, но есть только семь различных размеров, которые я проверяю снова и снова.) Браузеру потребуется больше времени для синтаксического анализа?


person sdleihssirhc    schedule 13.07.2011    source источник
comment
Не знаю насчет скорости, но известно, что медиа-запросы приводят к сбою IE9.   -  person BoltClock    schedule 13.07.2011


Ответы (1)


Код, обрабатывающий потенциально медленные пути, сильно оптимизирован в современных браузерах, поэтому вам не нужно предварительно оптимизировать такие вещи, если только вам это не нужно, имея под рукой данные профилирования. Давай, пиши.

person Alexander Pavlov    schedule 26.12.2011