Chat Nov. 17 — Post-Processors

 First, look up SASS and LESS. These are pre-processors. What do they do?

SASS and LESS are CSS pre-processors, meaning they extend the CSS language with features that don’t exist, adding features that allow variables, mixins, functions and many other techniques that allow you to make CSS that is more maintainable, themable and extendable.

What are some of the “dark side” aspects of pre-processors, according to the author? Sass has a dark side. Its potential malevolence tends to manifest when it’s wielded without attention or deep understanding.

  • Pre-processors have a way of keeping us at arm’s length from the CSS we’re building.
  • It’s a burden to keep up on what’s evolving in CSS itself along with the tricks we can pull off specific to our pre-processor.
  • Overzealous use of the @extendfeature in Sass can create bloated stylesheet files bobbing in a swamp of repeated rules.
  • Immoderate nesting can lead to abstruse, overlong, and unintentionally over specific selectors.

What are the names of some post-processors that are out there?

autoprefixer–  takes CSS and adds appropriate vendor prefixes to make it work in as many browsers as possible.

 

What do post-processors do?

  • feed on actual CSS.
  • they can act like polyfills, letting you write to-spec CSS that will work someday and transforming it into something that will work in browsers today.
  • Many post-processors do only one specific thing. (i.e. polyfill for remunits, autogenerate inline image data.

What are the potential benefits of post-processors?

You don’t have to learn another language or another platform. You use actual CSS first.