Git Product home page Git Product logo

mincss's Introduction

mincss

Build status

Clears the junk out of your CSS by finding out which selectors are actually not used in your HTML.

By Peter Bengtsson, 2012-2014

Example

$ mincss https://github.com

Installation

From pip:

$ pip install --upgrade git+https://github.com/peterbe/mincss

Why?

With the onslaught of Twitter Bootstrap upon the world it's very tempting to just download their whole fat 80+Kb CSS and serve it up even though you're not using half of the HTML that it styles.

There's also the case of websites that have changed over time but without the CSS getting the same amount of love refactoring. Then it's very likely that you get CSS selectors that you're no longer or never using.

This tool can help you get started reducing all those selectors that you're not using.

Whitespace compression?

No, that's a separate concern. This tool works independent of whitespace compression/optimization.

For example, if you have a build step or a runtime step that converts all your CSS files into one (concatenation) and trims away all the excess whitespace (compression) then the output CSS can still contain selectors that are never actually used.

What about AJAX?

If you have a script that creates DOM elements in some sort of window.onload event then mincss will not be able to know this because at the moment mincss is entirely static.

So what is a web developer to do? Simple, use /* no mincss */ like this for example:

.logged-in-info {
    /* no mincss */
color: pink;
}

That tells mincss to ignore the whole block and all its selectors.

mincss's People

Contributors

ajdavis avatar chrisdl avatar frewsxcv avatar j33f avatar ksokhan avatar peterbe avatar rerb avatar

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.