search

connectivedx / Phoenix

http://connectivedx.github.io/Phoenix/
33 stars 5 forks source link

CSS Optimizer #29

Closed ajmueller closed 10 years ago

ajmueller commented 10 years ago

There is a Gulp plugin for CSS optimization that I think is worth a look.

https://www.npmjs.org/package/csso

pc-pdx commented 10 years ago

A surface look appears interesting but there seem to be a large number of issues open.

A fair number of them seem to be nitpicky, or less than stellar tickets from 'eGavr' . But 106 open seems a bit high.

One of those issues is probably a big deal in the fact that it doesn't appear to support Source Maps which would(or, at least, should) break good dev process.

pc-pdx commented 10 years ago

Turns out our current set-up (node-sass) has troubles generating source maps on windows machines and thus requires editing the node-module index.js a'la this. -- this of course is a no go as far as sharing a local edit between devs, much less any build server. I realize that node-sass isn't the optimizer and there appears to be other options like gulp-sourcemaps so if that plugin is functional - i'd withdraw the initial sourcemap concern as a blocker.

justinskolnick commented 10 years ago

"Merging blocks with identical selectors" worries me. The Sass team turns down request after request for the feature — out of concern that the reward of serving fewer selectors isn't worth the risk of messing with a well-defined cascade. Their position appears to be that the cascade is not be messed with. I think that's a good position.

The number of open issues is a concern for me also. On the other hand, if you all run a batch of rigorous, homegrown tests on active client projects, and the tests return a satisfying ratio of green dots to red dots, it's worth a try.

ajmueller commented 10 years ago

@pc-pdx, I personally haven't found source maps to be all that useful and @justinskolnick and I actually disabled it on a recent project because it caused incredible file bloat (like 4x size increases). So I agree that source maps shouldn't be a blocker for this reason and for the one you mentioned above.

The number of issues is definitely concerning. I'm hoping to find some time soon to run some tests and see how this fits into our build process, particularly with regards to the "combine media queries" package we use.

pc-pdx commented 10 years ago

I actually did a bit of work on the gulp-sourcemaps and that's a no-go, as in busted, I did not follow up as i'm waiting on this mornings FED meeting to discuss our/the dev approach (as we don't seem to concat in dev, thereby nullifying any need for sourcemap'age) . Based on that, anything sourcemap related is best destined for a separate ticket and relinquish this hijack.

kamsar commented 10 years ago

All of the gulp-using projects concat all the time, and uglify when in prod build mode.

kamsar commented 10 years ago

I swapped in csso for shits and ran a test of it vs gulp-minify-css (which uses cleancss).

It saved less than 1k when run against slightly out of date Meadows CSS. Given the overall dangers and reported issues people have had while using it, I don't think the minuscule gain (0.5%?) is worth the risk.

Recommend closing.

ajmueller commented 10 years ago

Works for me. Thanks for taking a look at that, Kam, with some real project CSS.

Out of curiosity, did you happen to notice any styles break? Feel free to close this after commenting.

kamsar commented 10 years ago

tbh I only compared file sizes; I was in my prototype project and there's no markup