Package description
CSSO (CSS Optimizer) is a CSS minifier. It performs three kinds of optimizations: structural optimizations, reducing CSS size by merging blocks with identical properties, removing overridden properties, etc.; cleaning (removing unused @media rules, cutting out the comments, etc.); and compressing (transforming values to shorter forms, merging identical selectors, etc.). It can be used as a command-line tool or as a library.
Minification
Minifies CSS by removing whitespace, comments, and making other optimizations to reduce file size.
const csso = require('csso');
const minifiedCss = csso.minify('.test { color: #ff0000; }').css;Structural Optimization
Optimizes CSS structure by merging blocks with identical properties and removing overridden properties.
const csso = require('csso');
const optimizedCss = csso.minify('.test { color: red; } .test { font-size: 16px; }', { restructure: true }).css;Source Map Generation
Generates a source map that can be used to debug the minified CSS by mapping it back to the original sources.
const csso = require('csso');
const result = csso.minify('.test { color: red; }', { sourceMap: true });
const minifiedCss = result.css;
const map = result.map.toString();clean-css is a fast and efficient CSS optimizer for Node.js and the Web. It provides similar minification capabilities as CSSO but also offers advanced optimizations like restructuring.
uglifycss is a CSS minifier that aims to be fast and simple. It doesn't have as many features as CSSO, focusing mainly on removing whitespace and comments to compress CSS files.
purifycss is a tool to remove unused CSS. Unlike CSSO, which focuses on optimizing existing CSS, purifycss analyzes your content and CSS files to remove unused selectors.
Changelog
1.4.1 (October 20, 2015)
display property (#167, #244)rect (clip property value) mergeprepublish (thanks to @silentroach)Bringing project back to life. Changed files structure, cleaned up and refactored most of sources.
src folder)browserify (no more make, and web folder), browser version is available at dist/csso-browser.jslib/index.js nownode.js version is 0.12 nowjscs to control code stylegh-pages updateminify(src, options), options:
restructuring – if set to false, disable structure optimisations (true by default)debug - outputs intermediate state of CSS during compression (false by default)justDoIt() method (use minify instead)treeToString() method to stringify()printTree() methodcolumn and offset addedln renamed to line--rule and --parser (suppose nobody use it)-off alias for --restructure-off as incorrect (only one letter options should starts with single -)--debug that reflecting to options.debug for minify/deep/ combinator support (#209)hsla to rgba and hls to rgbrgba with 1 as alpha value to rgb (#122)rgb and rgba percentage values to absolute valuesrgba for normalized/interpolated values+ and - (#228)flex property as it could change value meaning (#200)\9 hack values (#231)!important issue for top-right-bottom-left properties (#189)top-right-bottom-left properties merge (#139, #175)Readme
CSSO (CSS Optimizer) is a CSS minimizer unlike others. In addition to usual minification techniques it can perform structural optimization of CSS files, resulting in smaller file size compared to other minifiers.
npm install -g csso
csso [input] [output] [options]
Options:
--debug Output intermediate state of CSS during compression
-h, --help Output usage information
-i, --input <filename> Input file
-o, --output <filename> Output file (result outputs to stdout if not set)
--restructure-off Turns structure minimization off
-v, --version Output the version
Some examples:
> csso in.css out.css
> csso in.css
...output result in stdout...
> echo ".test { color: #ff0000; }" | csso
.test{color:red}
> cat source1.css source2.css | csso | gzip -9 -c > production.css.gz
var csso = require('csso');
var compressed = csso.minify('.test { color: #ff0000; }');
console.log(compressed);
// .test{color:red}
// you may do it step by step
var ast = csso.parse('.test { color: #ff0000; }');
ast = csso.compress(ast);
var compressed = csso.translate(ast, true);
console.log(compressed);
// .test{color:red}
May be outdated
FAQs
CSS minifier with structural optimisations
We found that csso demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 3 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
CISA launched a new project called Vulnrichment to enrich CVEs with details that help prioritize patching and mitigation efforts, as the NVD backlog of unenriched CVEs awaiting analysis surpasses 10,000.
Security News
Socket is joining forces with CISA and other industry leaders at the RSA Conference to sign the Secure by Design pledge, committing to uphold the highest security standards in our products.
Research
The Socket research team breaks down a sampling of malicious packages that download and execute files, among other suspicious behaviors, targeting the popular Discord platform.