Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

OOCSS + Sass = The best way to CSS

ianstormtaylor.com

Post reply on HN
Print view View original

21–30 of 57 posts

Re: OOCSS + Sass = The best way to CSS

#21

Post by ianstormtaylor »

colinsidoti wrote: post #20
ianstormtaylor wrote: post #14

Earlier quoted context omitted.

The entire point of @extend is so that you don't get the extreme code duplication of mixins. I can't speak authoritatively on LESS since I stopped using it a long time ago, but what happens when you apply that `.media` pattern to another selector? It duplicates all the styles, instead of grouping common selectors into one style definition like @extend does. And the point is even @extend can get bloaty when nested, bu…

"It duplicates all the styles, instead of grouping common selectors into one style definition like @extend does." This didn't come through entirely until I read the comment. I think an example of what mixins would produce would be helpful. At the end of the day we have two goals: 1) keeping things easy to develop and 2) keeping the CSS filesize as small as possible. Mixins accomplished 1 but not 2. One potentially re…

Yup, that's completely right! I should probably add a bit about mixins being bloaty, so people don't get the wrong idea.

Re: OOCSS + Sass = The best way to CSS

#24

Post by necolas »

I haven't had the experience that HTML is harder to maintain if you use classes more liberally. What this approaches forces you to do is: write or edit CSS every time you want a new combination of existing traits...which isn't ideal either.

The post also suggests that certain class names are "unsemantic", when they obviously aren't. They just have different meaning to the sorts of class names the author is advocating.

Re: OOCSS + Sass = The best way to CSS

#29

Post by ianstormtaylor »

pknight wrote: post #19
ianstormtaylor wrote: post #14

Earlier quoted context omitted.

The entire point of @extend is so that you don't get the extreme code duplication of mixins. I can't speak authoritatively on LESS since I stopped using it a long time ago, but what happens when you apply that `.media` pattern to another selector? It duplicates all the styles, instead of grouping common selectors into one style definition like @extend does. And the point is even @extend can get bloaty when nested, bu…

It's quite easy to create duplicate styles in the output with mixins - the compiler isn't that smart yet, do placeholders avoid all of that? I haven't seen a lot of comparisons or examples that really drive it home so far. I'm actually working on a css post-processor script that optimizes css output. Grouping styles in the most efficient way possible is quite tricky.

@extend avoids duplication, but by itself it has some other bloat problems. @extend + %placeholders completely avoid duplication. Thing is @mixins aren't supposed to avoid duplication, they just inject, and should keep the declaration in the same position in the stylesheet.

Re: OOCSS + Sass = The best way to CSS

#30

Post by [deleted] »

pknight wrote: post #19
ianstormtaylor wrote: post #14

Earlier quoted context omitted.

The entire point of @extend is so that you don't get the extreme code duplication of mixins. I can't speak authoritatively on LESS since I stopped using it a long time ago, but what happens when you apply that `.media` pattern to another selector? It duplicates all the styles, instead of grouping common selectors into one style definition like @extend does. And the point is even @extend can get bloaty when nested, bu…

It's quite easy to create duplicate styles in the output with mixins - the compiler isn't that smart yet, do placeholders avoid all of that? I haven't seen a lot of comparisons or examples that really drive it home so far. I'm actually working on a css post-processor script that optimizes css output. Grouping styles in the most efficient way possible is quite tricky.

[deleted]
Post reply on HN