Are there any glaring difference between the two that are not immediately apparent? They seems to share many similar concepts like mixins, variables, and inheritance. Has any one encountered problems with performance in production?
There's a lot of misinformation in this thread.
First of all, recent versions of SASS include support for SCSS syntax, which means you can basically start with plain old CSS and learn to use variables, mixins, nesting, etc from there. Second, learning SASS syntax is not at all difficult. It's exactly like CSS, except without curly braces and semicolons, and it's whitespace sensitive. I find this results in much more readable code, and is much faster to write than standard CSS. In fact, writing regular CSS now feels like a chore, so I've started using Staticmatic (which supports HAML/SASS) when I want to do quick static prototypes.
This is my experience exactly. Writing "raw" CSS makes me twitch now. Sass is just beautiful, easy to read, maps naturally to markup structure, and is terribly easy to maintain.
It's strange that no one has done this yet so I wrote up an explanation of how the languages compare. It's too long to post here so I made a gist. I hope this will help you learn the differences and evaluate the two projects:
I am the author of compass so I definately understand Sass more intimately than Less. Please feel free to correct any misunderstandings I might have. Also note: I am comparing the versions of Sass and Less that they suggest on their main websites -- both have some very cool features and enhancements in the pipeline.
I struggled with the exact same question the last few days. Semantically both have the same features. You can find an informed comparison here: http://devtionary.com/?p=89
My initial preference was Less, because sass seemed framgmented with 2 syntaxes, and also less seemed more aesthetic, but I ended choosing Sass for the following reasons:
- with Compass I can monitor a whole directory of templates at once, and have them instantly compiled when I save from the editor, not sure if Less can do this
* Aptanta Studio 3 and few other IDE's know to syntax highlight sass and scss, not sure about less
* If you don't like the indentation syntax you can use the curly Scss, Scss and Sass are interoperable, you can call one from the other and vice versa
* The ruby version of Less is deprecated and I write a ruby based project (indeed, not all HN users are pythonists)
Moreover, I don't like the idea on compiling the templates client side (as in less.js) and waste precios miliseconds, nor use an external interpreter (node.js)
It's not actually true that Sass and Less have the same features. Each has some features the other doesn't, with Sass having substantially more than Less. Notable examples include the ability to use variables in selectors, the @extend directive, and a wealth of useful built-in functions. It's because of these and other features that Compass can be built on Sass, where it couldn't be built on Less.
I started using LessCSS back when SCSS didn't exist, so it was a choice between SASS' brand new, backwards incompatible syntax and Less' "progressive enhancement" philosophy.
Since then SASS has grown the SCSS syntax, but haven't really given me a reason to bother switching.
Also: Less now has the even better less.js, which is handy for quickly throwing together less stylesheets and really fast on the command line compared to the old Ruby version (an order of magnitude faster for 4,000+ line files).
