Socket
Socket
Sign inDemoInstall

csso

Package Overview
Dependencies
0
Maintainers
1
Versions
82
Alerts
File Explorer

Advanced tools

Install Socket

Detect and block malicious and high-risk dependencies

Install

    csso

CSSO — CSS optimizer


Version published
Maintainers
1
Install size
255 kB
Created

Package description

What is csso?

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.

What are csso's main functionalities?

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();

Other packages similar to csso

Readme

Source

1. Introduction

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.

This document describes installation and usage of CSSO. If you want to learn more about the inner workings of CSSO, please consult the [manual] (https://github.com/afelix/csso/blob/master/MANUAL.en.md).

Please report issues on [Github] (https://github.com/afelix/csso/issues).

For feedback, suggestions, etc. write to skryzhanovsky@ya.ru.

2. Installation

2.1. Prerequisites

  • for browser use: any OS and a modern web browser
  • for command line use: Linux / Mac OS X / any OS with working Node.js

2.2. Install using git

Prerequisites:

To install:

  • run git clone git://github.com/afelix/csso.git

2.3. Install using npm

Prerequisites:

To install:

  • run npm install csso

3. Usage

3.1. In the browser

Open web/csso.html or http://afelix.github.com/csso/csso.html in your browser.

CSSO is not guaranteed to work in browsers. Preferred way to use this tool is to run it from the command line or via npm modules.

3.2. As an npm module

Sample (test.js):

var csso = require('csso'),
    css = '.test, .test { color: rgb(255, 255, 255) }';

console.log(csso.justDoIt(css));

Output (> node test.js):

.test{color:#fff}

3.3. From the command line

Run bin/csso (when installed from git), you will need to have nodejs 0.4.x installed — http://nodejs.org

Run csso (when installed from npm).

Usage:

csso
    shows usage information
csso <filename>
    minimizes the CSS in <filename> and outputs the result to stdout
csso -h
csso --help
    shows usage information
csso -v
csso --version
    shows the version number

Example:

$ echo ".test { color: red; color: green }" > test.css
$ csso test.css
.test{color:green}

4. Minification (in a nutshell)

Safe transformations:

  • Removal of whitespace
  • Removal of trailing ;
  • Removal of comments
  • Removal of invalid @charset и @import declarations
  • Minification of color properties
  • Minification of 0
  • Minification of multi-line strings
  • Minification of the font-weight property

Structural optimizations:

  • Merging blocks with identical selectors
  • Merging blocks with identical properties
  • Removal of overridden properties
  • Removal of overridden shorthand properties
  • Removal of repeating selectors
  • Partial merging of blocks
  • Partial splitting of blocks

The minification techniques are described in detail in the manual.

5. Note to developers

CSSO is written in easy-to-understand JavaScript. It's easily portable to other languages, such as Python, Java, PHP, Perl, C++, C, etc. The source code is licensed under MIT.

6. Authors

7. And finally

  • CSSO is licensed under MIT

FAQs

Last updated on 01 Sep 2011

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.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc