Ask HN: Thoughts on Sass | Hacker News Reader

Ask HN: Thoughts on Sass

8 pointsjgv12 comments

Anyone using Sass in production? Do you love it? Hate it? I'm thinking of implementing in a project but I don't want to end up making a bad decision. Thoughts on Sass?

View on HN

We've been using Sass in production since we launched. Love it.

I've not seen any real comparison between LessCSS and SCSS (i.e. the new Sass syntax that became available with Sass version 3.0) There were some real differences before that, but that's not nearly so clear to me anymore.

At present, we've decided that there's no reason to use LessCSS as we already use Haml and there's nothing that Less offers that gives us a reason to switch from recent versions of Sass. I'm not even sure what the differences are now.

Have you found that it produces stylesheets that are noticeably larger than what you would have written in just CSS?

In my experience, no. After generating the CSS, we run it through YUI compressor for the deployed version. Any size differences remaining are measurable in bytes, and the ability to truly refactor our stylesheets more than makes up for that small difference.

My experience has been the opposite - stylesheets get smaller, because there's less repetition and fewer wasted styles. CSS has a really nasty habit of ballooning over time into an unholy tarpit of selectors and overrides and exceptions, especially when you're working with multiple people in the code.

Any bloat caused by the more verbose selectors seems to be easily offset by the lack of repetition, and the maintenance is orders of magnitude easier to manage. At the end of the day, you're still talking about maybe a couple of extra kb, which ends up being a negligible number of bytes post-gzip. In exchange, you get massively easier-to-manage stylesheets and a whole lot less developer time spent to make things happen.

Over the past couple of weeks, I've been refactoring a very large stylesheet with SASS.

  Original size: 138.8k (gz: 23.5k, 16.9% original size)
  Sass-generated size: 105.9k (gz: 18.2k, 17.1% original size)

Very, very easily worth the transition, and as a bonus, the stylesheet is factored into a bunch of partials, each relevant to different parts of the site, so when I want to tweak something in comments, I just open _comments.sass and hack there, rather than trying to find the right section in a monolithic stylesheet.

Replying to my own comment, but Chris Eppstein has put up a gist of some differences, both syntactical and semantic, between SCSS and LessCSS. They are very, very similar to each other now, as I thought.

https://gist.github.com/674726

I think it genuinely addresses some of the design flaws of css (too much repetition). That can't be bad. But I'm not sure a new syntax needs to be created for the job. I'm having a little play with using plain json to represent css in a similar style: http://github.com/twfarland/son (on node.js/express). There are still some things I need to add (firebug integration, creating actual css files) but it seems helpful so far.

I'm using it in production in multiple places, and I adore it. I will never go back.

If you want to just dip your toes in, look at SCSS. It's a superset of CSS, so you can take your existing stylesheets and start using more advanced features.

That said, I prefer pure SASS. It's cleaner, IMO, forces better organization, and is less typing.

I recommend checking out http://lesscss.org/ - haven't used SASS recently, not sure how well it compares these days. Used to be not as powerful as Less.

I've looked into both and they seem like they share a lot of similar concepts. Why have you chosen Less over Sass?

It seems like a potential issue with less/sass could be producing gigantic css files.

I like the pure javascript less.js version: no gem, no plugin, all in the browser: http://is.gd/gOBou and http://is.gd/gOBpV

Are you using this in production? If so how has performance been?

As an aside, don't use minified links.

Reply on news.ycombinator.com