CSS on Server Side?

Question

I ran into LESS website and this is the description of they are doing"

LESS extends CSS with dynamic behavior such as variables, mixins, operations and functions. LESS runs on both the client-side (IE 6+, Webkit, Firefox) and server-side, with Node.js.

What does it mean "and server-side" with Node.js? I know that you can write server-side code with javascript using Node.js, but what is the meaning of having CSS on server-side and how is it useful?

Answer 1

What does it mean "and server-side" with Node.js? I know that you can write server-side code with javascript using Node.js, but what is the meaning of having CSS on server-side and how is it useful?

It's not the CSS that's (optionally) done server-side, it's the LESS processing, which results in normal CSS that gets sent to the client.

So if you have a .less file on your web server with this:

@color: #4D926F;

#header {
  color: @color;
}
h2 {
  color: @color;
}

...and you have your web server configured to process .less files through the LESS compiler running under Node.js (e.g., just as .php files are processed through the PHP interpreter, .py files through the Python interpreter, etc.), then the output of the LESS compiler (pure CSS) gets generated and sent to the client:

#header {
  color: #4D926F;
}
h2 {
  color: #4D926F;
}

This is (a tiny bit) more load on your server, but means you don't have to worry about running the LESS compiler on the browser (e.g., you can support non-JavaScript clients).

Answer 2

I'm pretty sure it means that you can run the LESS code with Node.js during your application build phase in order to pre-expand the CSS.

In other words, it lets you do that server-side before deployment (or, I guess, on demand, if you wanted to) in order to improve client-side performance.

Answer 3

The LESS compiler is implemented in JavaScript and the compiler can run both on the client as well as the server (using NodeJS)

Answer 4

my bet: it would compile the css server-side, and push it to the client