ince i announced my new Book a while ago, many people already asked me if i did switch from Less to Sass. My new book is called “Sass and Compass Designer’s Cookbook” and before i wrote some books about Less. I’m not going to tell you which pre-processor for CSS code you should use. Many others already wrote about Less vs Sass. I only advice you to use a pre-processor for CSS ever, if you do not yet you should start today!
CSS pre-processors like Sass and Less help you to code your CSS code DRY (Do not Repeat Yourself). Pre-processors solve the disability of CSS to use variables and function to prevent code duplications. Coding non-DRY CSS code every day is definitely a defect in your develop process and there is no reason to not fix this defect directly!
What are the differences between Sass and Less? Sass has been written in Ruby and Less in JavaScript (original in Ruby too).
Less runs in Node and browser (client side), Rihno support seems to be dropped since v2, but their is also less4j. Most people will only use Less in browser for testing purposes. Less in Node can be used for the command line compiler and easily integration with task runners like Grunt and Gulp to set up complete build chains.
On the other hand there is libsass, the c/c++ library with interpreters for C, Node, JavaScript and even Ruby. The JavaScript interpreter enable you to run Sass in browser too, whilst node-sass can be used to set up a build chain.
I think the big difference will be the language itself. Less is declarative language designed to behave and look as closely to css as possible. Sass on the other hand looks more like a imperative language. Both languages extend CSS with variables, nesting, mixins and inheritance. Sass allows function whilst Less does not, Sass uses if / else statement and Less uses guards to achieve the same. Same for loops; Sass has a @while and @for directive and Less uses guards here too.
Side effects of the declarative nature of Less are the lazy loading and last declaration wins rule for variables, which means that you can easily override any variable by putting the definition afterwards. The ability to put a variable definition afterwards makes Less very suitable to implement flexible frameworks and other reusable structures.
But i’m sure that you are still wondering which pre-processor you should use for your project. I think your choice should depend on the components and frameworks you will use for your project. When you start a Foundation project you will choose Sass and for a Bootstrap 3 project Less will be a better choice.
You should notice that Bootstrap 4 switches from Less to Sass recently. Their motivation: “Sass compiles faster than ever thanks to Libsass, and we join an increasingly large community of Sass developers”. The choice of the Bootstrap team could be the kiss of death for Less. Even if so, this is still not a proof of the superiority of Sass, because of factors which cause such a lock-in, or path-dependence may be very complex. Also remember the Video 2000 system of Philips or your own QWERTY keyboard.