Как влияет на разработку использование препроцессора и постпроцессора CSS?

Question

[Дмитрий Самутин]

Я начинающий верстальщик, писавший на чистом CSS, столкнулся с фактом существования препроцессоров и постпроцессоров. Не совсем понятно их применение, ясно только то что они неким образом улучшают жизнь. Так вот не могли бы мне объяснить вкратце чем же они облегчают жизнь и стоит ли их использовать или продолжать писать на чисто CSS?

Если поточнее:

1. В чём разница между постпроцессорами препроцессорами?
   
2. Нагружает/замедляет ли сайт их использование?
   
3. Насколько способно то или иное решение ускорить разработку сайта и ускоряет ли вообще?
   
4. Каким образом способно ускорить разработку? (если ускоряет)
   
5. В чём различие SASS от LESS? (не лучше/хуже, а плюсы, минусы, различия и рекомендации)
   
6. влияет ли back end на использование? (допустим, как вариант: используя LESS необходимо использовать некий фреймворк или библиотеку Ruby для его работы)
   
7. Какие препроцессоры и постпроцессоры используете Вы и почему? (повторюсь: не лучше/хуже, а плюсы, минусы, различия и рекомендации)
   

Comments

[copal]

Информации очень много. но просто неприлично много чтобы в 2016 году задавать такие вопросы. На чистом css никто не пишет. По началу разницы между SASS и LESS Вы не увидите.
Лично я не знаю какие библиотеки есть на LESS, но sass есть все что душе угодно. использую sass и очень им доволен.

[Андрей]

Неправда, я пишу на чистом CSS, правда его мало и он корявый, т.к. проекты все сплошь внутренние и до красоты там никому дела нет, главное чтобы циферки считало как надо.

Но в целом согласен, прогресс идет своим чередом и пора уже соответствовать современной действительности. Умнейшие люди все это придумали не зря, а чтобы облегчать жизнь...

Answer 1

[zooks]

Если обобщенно, то становится меньше рутины - монотонных повторных действий.

Чтобы не гадать - сразу выбирай SASS в синтаксисе SCSS. Нужна скоростная реализация libSass, которую прикручиваешь к gulp. Дальше добавляешь к этому autoprefixer, который позволит забыть о ручной расстановке префиксов. Больше никаких "постпроцессоров" не надо. Но прежде чем приступить к этому шагу ты должен хорошо знать CSS.

Вот неплохая статейка для начинающих (англ.)
https://scotch.io/tutorials/getting-started-with-sass

Answer 2

[Андрей]

SASS работает на бэкенде, в браузер приходит обычный CSS.

LESS работает в браузере, стало быть накладные расходы на клиенте увеличиваются как за счет дополнительной закачки библиотеки, так и за счет ее работы.

А задачу оба подхода решают примерно одинаковую - добавить в CSS то, чего там пока нет, в частности переменные и расчеты на лету... Ну и вообще хоть на гугле, хоть на ютубе информации просто неприлично много, и можно буквально за пару дней неплохо поднатореть в теории.

Comments

[dom1n1k]

Компиляция LESS в браузере налету - это один из вариантов и используется он только для отладки или каких-то быстрых костылей. На продакшене CSS там всё же предкомпилированный почти всегда.

[Андрей]

Ну про SASS в браузере мне слышать не доводилось, хотя я вообще мало интересовался этим направлением в виду отсутствия потребности. Хотя вот буквально вчера смотрел немного про JSX и JSS, и уже ничему не удивлюсь...