What are the advantages/disadvantages of using CSS preprocessors (e.g Sass, LESS)

css sass less css-preprocessor
Naz picture Naz · Feb 17, 2015 · Viewed 8.7k times · Source

There are rarely any projects nowadays that don't use any type of CSS preprocessors like Sass or LESS. While it has bee widely accepted and advantages are pretty clear (like more structured code, no include performance decrease and many others). I was wandering if there are any huge disadvantages. One that I can think of right away is too big nested selectors that could perform poorly during repaints/reflows. Any other reasons why not to use preprocessor?

Answer

Leo Farmer picture Leo Farmer · Feb 17, 2015

One thing you can find with preprocessors is that you end up with vast outputs of css due to the nesting. On a small project it is easy to keep under control, on a large project with multiple developers it takes discipline to keep the amount of css generated under control.

Related questions

Does LESS have an "extend" feature?

SASS has a feature called @extend which allows a selector to inherit the properties of another selector, but without copying the properties (like mixins). Does LESS have this feature as well?

Read More
Is there a SASS.js? Something like LESS.js?

I have used LESS.js before. It's easy to use, something like <link rel="stylesheet/less" href="main.less" type="text/css"> <script src="less.js" type="text/javascript"></script> I saw SASS.js. …

Read More
CSS to SASS (or LESS) conversion

Can anyone recommend some CSS to less, or CSS to sass conversion tools? I have found a few .e.g. http://css2less.cc/ and http://css2sass.herokuapp.com/ but any insight into their reliability (or recommendations of other …

Read More