CSS Preprocessors - Сборка CSS для каждой загрузки страницы или просто для процесса сборки?

Question

Просто попадаем в увлекательный мир препроцессоров CSS. Допустим, мы используем LESS для рендеринга нашего CSS. Мне интересно о двух разных подходах:

• Использование LESS для рендеринга CSS при каждой загрузке страницы.
• Использование LESS как части процесса сборки и просто использование визуализированного CSS в производстве.

Мне интересно, есть ли времена, когда вы бы использовали один, а не другой. С одной стороны, у вас есть динамический CSS во время выполнения, а с другой - статическая сборка CSS из (надеюсь) краткого и понятного шаблона LESS.

Answer 1

Эта статья написана на CSS-хитрости от Криса Койера

Крис говорит, что возможно, с МЕНЬШЕ, использовать .less файл с использованием link пометить, как вы делаете с нормальным .css файлы

<link href="style.less">

Хотя это один из способов обработки файла, это не самый эффективный способ сделать это. Это может серьезно замедлить загрузку и может привести к сбою браузера. Было бы лучше использовать камень LESS для преобразования LESS в CSS. Как говорит Крис,

"Предварительная" часть предварительной обработки, которую вы можете рассматривать как "перед отправкой этих файлов на действующий веб-сайт".

Вот хорошая статья, которая объясняет различные способы обработки .less файлы.

На клиентской компиляции автор хорошо подытоживает

Вместо того, чтобы код Sass/LESS компилировался один раз, он компилируется при каждом отдельном запросе страницы - и, что еще хуже, вы возлагаете эту нагрузку на своих пользователей, а не делаете это самостоятельно

Во-вторых, именно для этого и были созданы CSS-препроцессоры. Они были созданы для того, чтобы иметь управляемый CSS-скрипт с высокой читабельностью и малой сложностью изменений. Тогда вам даже не нужно смотреть на файл CSS. Просто отправьте его в страну браузеров, где он все равно будет разорван на части при помощи определенных браузеров (кашель, кашель IE).