Методы для модульного CSS

Question

Я хочу начать использовать модульный CSS, но у меня возникают проблемы с поиском наилучшего способа его реализации.Я думал, что мог бы просто использовать метод моста , где у меня есть один в моем HTML, а затем операторы @import для каждого модуля.Мне нравится простота этого метода, но я обеспокоен его негативным влиянием на производительность, поскольку таблицы стилей @ import-ed будут загружаться позже и не обязательно параллельно.Поэтому я хочу знать, есть ли другие популярные методы для реализации модульного CSS.Я действительно не хочу делать несколько тегов, потому что PageSpeed ​​и Yslow жалуются на очень много таблиц стилей (хотя я знаю, что это на самом деле более эффективно, чем @import).В идеале я хотел бы объединить таблицы стилей в одну на сервере, поэтому каждый браузер запрашивает одну таблицу стилей.

Answer 1

Использование серверной части включает сборку ваших «модулей» в одну таблицу стилей на серверной стороне.Таким образом, имеется некоторый кеш на сервере, поэтому он не должен выполнять сборку при каждом запросе.Для этого есть множество технологий, но в вашем сообщении ничего не говорится о вашем программном стеке.

Answer 2

Просто будьте предельно осторожны, как вы это делаете. Кэширование - ваш друг, и если вы решите предоставлять специально созданные для сервера CSS-страницы, вы потеряете преимущество кэширования. Это классическая проблема курицы и яйца. Вы предварительно загружаете и кешируете весь свой CSS и принимаете все заранее, или настраиваете загрузку каждой страницы и получаете ли вы при каждом изменении страницы? Только ты знаешь, что лучше.

Не переусердствуйте в этом. Я работал в огромных магазинах, где незначительные изменения в минимизации привели к улучшению на 5 гигов в день (с миллионами уникальных номеров) ... но большинство сайтов, над которыми я работал, не увидели бы вообще никакой выгоды. Если у тебя есть время, сходи с ума. В противном случае, пропорции вашего ответа основаны на необходимости. Эти оптимизаторы сообщают об идеальных условиях, и мы все знаем, что это не так в реальной жизни. Попробуйте запустить оптимизатор на некоторых крупных сайтах когда-нибудь (не пропустите и их проверку). Это хорошо для веб-гика.

Answer 3

Ознакомьтесь с Compass CSS Framework .Он поддерживает модульный CSS с помощью миксинов и делает работу с CSS более приятной в целом, добавляя переменные, арифметику и включая такие стилевые структуры, как Blueprint .