5 ms·

IMO, LESS's strength is that its implementation is JavaScript. Allowing for real-time compilation during authoring in-browser is great, and coupled with uglifyj

by potch 14y ago

IMO, LESS's strength is that its implementation is JavaScript. Allowing for real-time compilation during authoring in-browser is great, and coupled with uglifyjs and cleancss (also js) allows for a single dependency during our build stage. This has some very interesting ideas, but maybe I'm just a purist- ignoring the concept of the "cascade" seems counter intuitive to me.

r0s 14y ago
Well maybe I'm blind, but I honestly don't see the benefit of CSS compilation. Client side is the only use case I'd even consider, I've been using php to augment styles for years. Yet, js compiled CSS seems like it breaks tools like Firebug or the Chrome inspector. And version control systems. What am I missing?
- ericclemmons 14y ago
  You've used PHP to augment styles (as have I), I've even used Twig, and have now been using LESS. Version control is no different, and you typically compile on the server before sending to the client. The LESS.js shim is for convenience, like when you're editing a site over FTP with no access to the server. CSS precompilers help DRY up your code and introduce structure. For example, no more repeating that hex value and forgetting which red is the error red vs the logo red, constantly retyping vendor prefixes, or maintaining a single gigantic stylesheet. As a PHP developer, I prefer to "refresh to see changes", which is why using Assetic is a must for compiling both CSS and JS resources.
- youngtaff 14y ago
  Compiling CSS client-side slows the page load down... For less.js the browser has to download the js, then the less file and then produces the CSS Until the browser has the CSS it can't start rendering the page. Here's a waterfall for lesscss.org (http://www.webpagetest.org/result/120509_18_ff2ca6e34c6b8e9085b97168d3bcc72d/1/details/ http://www.webpagetest.org/result/120509_18_ff2ca6e34c6b8e90...) notice how for a really simple webpage that the rendering doesn't start until over 1.2 seconds in!!!
- SquareWheel 14y ago
  By augmenting CSS with PHP, do you mean something like this? p {color: <?=$mainColor?>} And then just setting .htaccess (or whatever) to allow PHP execution in .css files?
  - r0s 14y ago
    You can just process main.css.php (or whatever) Here's some of my (old crappy)code: color: <?php echo $foreground1; ?>; font-family: <?php echo $font2; ?>; But I'm sure there's libs out there that make it really easy and pretty.
kmontrose 14y ago
Hmm, I'm not really sure how I'd pull off spriting if More were implemented in javascript. Maybe something with canvas and data uris, but file permissions would be really "fun". At Stack Exchange, we use dotLESS just fine without having to recompile when we change our .less files. Something Ben Dumke cooked up, an IIS HTTP module I want to say (honestly haven't dug into it). All that aside, tightening up the REPL is always worthwhile; something I'll through some time at. Maybe a file watcher approach, if I can get it working well cross-platform.

by potch 14y ago

r0s 14y ago

Well maybe I'm blind, but I honestly don't see the benefit of CSS compilation. Client side is the only use case I'd even consider, I've been using php to augment styles for years. Yet, js compiled CSS seems like it breaks tools like Firebug or the Chrome inspector. And version control systems. What am I missing?

ericclemmons 14y ago
You've used PHP to augment styles (as have I), I've even used Twig, and have now been using LESS. Version control is no different, and you typically compile on the server before sending to the client. The LESS.js shim is for convenience, like when you're editing a site over FTP with no access to the server. CSS precompilers help DRY up your code and introduce structure. For example, no more repeating that hex value and forgetting which red is the error red vs the logo red, constantly retyping vendor prefixes, or maintaining a single gigantic stylesheet. As a PHP developer, I prefer to "refresh to see changes", which is why using Assetic is a must for compiling both CSS and JS resources.
youngtaff 14y ago
Compiling CSS client-side slows the page load down... For less.js the browser has to download the js, then the less file and then produces the CSS Until the browser has the CSS it can't start rendering the page. Here's a waterfall for lesscss.org (http://www.webpagetest.org/result/120509_18_ff2ca6e34c6b8e9085b97168d3bcc72d/1/details/ http://www.webpagetest.org/result/120509_18_ff2ca6e34c6b8e90...) notice how for a really simple webpage that the rendering doesn't start until over 1.2 seconds in!!!
SquareWheel 14y ago
By augmenting CSS with PHP, do you mean something like this? p {color: <?=$mainColor?>} And then just setting .htaccess (or whatever) to allow PHP execution in .css files?
- r0s 14y ago
  You can just process main.css.php (or whatever) Here's some of my (old crappy)code: color: <?php echo $foreground1; ?>; font-family: <?php echo $font2; ?>; But I'm sure there's libs out there that make it really easy and pretty.

kmontrose 14y ago

Hmm, I'm not really sure how I'd pull off spriting if More were implemented in javascript. Maybe something with canvas and data uris, but file permissions would be really "fun". At Stack Exchange, we use dotLESS just fine without having to recompile when we change our .less files. Something Ben Dumke cooked up, an IIS HTTP module I want to say (honestly haven't dug into it). All that aside, tightening up the REPL is always worthwhile; something I'll through some time at. Maybe a file watcher approach, if I can get it working well cross-platform.