Jump to content
  • Announcements

    • alpenwasser

      Please Use CODE Tags   31 Jan 2016

      Welcome to the Programming and Software Design Section,

      When asking for help with programming issues, please use the code tags to enclose your code, it makes things much more easily readable for the people trying to help you, thus improving your chances of actually getting help.
        To add code tags, click the <> button on the editor toolbar, then enter your code in the code editor that appears. If you are on a mobile device, or prefer to use BBCode, you can use [code] // Your code here // It will be syntax highlighted, though not necessarily corectly. [/code] (but the code editor is more consistent and less buggy).

mincss Primer - Getting Rid of Unneeded CSS

Recommended Posts

Posted · Original PosterOP

A Small Introduction to mincss

Note: I'm a not experienced with Python. I have some general knowledge about it

and some scripting experience with other languages as well as some programming

knowledge in C/C++, but Python is mostly uncharted territory for me. So if

anyone spots some serious flaw or something that could be done alot better, feel

free to point it out (politely ;)) and I will happily correct it.

I'm mainly doing this because I have found the info on mincss which is out there

not very beginner friendly. That also means that I may not always describe the

most clever way of doing things for the sake of preserving understandability.

Having said that:

What Is It?

A tool which strips your CSS files of unneeded stuff. You give it a URL, it will

download that and parse it. Be careful though: If you have a CSS file used for

several pages on your site, it will mark stuff that is not used on the URL

you've given as unneeded. Completely logical of course, but important to keep

in mind.

What Do I Need

  • Python2 (not Python3, as of 2013-OCT-08)
  • mincss, obviously
  • lxml (a Python extension)
  • cssselect (also a Python extension)
  • PhantomJS is optional
I'm trusting you can manage to install this stuff yourself, if you're on a Linux

machine it should be in the repositories (it is for Arch as of 2013-OCT-08).

Let's Get Started

Note: I'm doing this on a Linux machine, if you discover something I'm

describing here not working on a Win PC, please let me know.

Start a command terminal and change into the directory where you have stored

mincss' files. Then start a Python2 console. On my Linux machine I simply type

python2 into the console and hit return. If it's worked you should be greeted

with a screen that has three > at its left:


Then, type in the following:

>>> from mincss.processor import Processor>>> p = Processor()
This will basically load mincss into the console (yes, I know: a simplification)

and initialize an object named p of type Processor.

After that, you give it an URL to download and instruct it to process whatever

it has found there.


>>> p.process_url('http://www.yourdomain.com/')>>> p.process()
This will detect any inline CSS if I understand things correctly, I have not yet

tried this out myself.


>>> p.inlines[]
And this searches the document for linked CSS stylesheets and puts the results

into an array, starting at index 0 (so, the first stylesheet will be located at

links[0], the second one at links[1] etc.). Don't mind the funky output.


>>> p.links[<mincss.processor.LinkResult object at 0x10a3bbe50>, <mincss.processor.LinkResult object at 0x10a4d4e90>]
Now you grab the first stylesheet and initialize it into object one

(again, the name is arbitrary). If more than one stylesheet has been found,

iterate through the array links[k] until you've initialized each stylesheet into

an object (alternatively, you can of course grab one stylesheet, proceed

further, then come back and initialize the second stylesheet into the same

object etc.).


>>> one = p.links[0]
You can check which CSS sheet has been grabbed by entering this command, it will

give back the name and location of said stylesheet.


>>> one.href'//d1ac1bzf3lrf3c.cloudfront.net/static/CACHE/css/c98c3dfc8525.css'
Now for the interesting bit: This will give out the length of the stylesheet

before it has been processed...


>>> len(one.before)83108
...and after processing:


>>> len(one.after)10062
By entering the following commands, you can print out the entire stylesheets

onto the screen if you wish:


>>> one.after>>> one.before
Now, this is nice and all, but what we would really like is generate a new, slimmed down

stylesheet, wouldn't we?

Thought so. Alright then, first we open a new filehandle for writing:

(It is entirely possible mincss has some sort of integrated function/method for creating

new, stripped down, files, but I have not been able to find anything on that so until

informed otherwise I will presume it does not.)


And voilà, you should now have a new file of the name yournewfilename.css in your current directory.

What Next?

As said I'm no Python guru, and I only encountered mincss for the first time a day or so ago, so there's

certainly some stuff missing from here, but it gets the job done which I think is probably at the top of

many people's list. I've also read that it can do Javascript, but have not played around with that yet.

If you wanted to automate this process, you could also write a script taking advantage of mincss, for an

example see mincss' own examples here.


Official Site

mincss Github


If you have any corrections, amendments, suggestions etc. feel free to post. :)

Happy coding,


BUILD LOGS: HELIOS - Latest Update: 2015-SEP-06 ::: ZEUS - BOTW 2013-JUN-28 ::: APOLLO - Complete: 2014-MAY-10
OTHER STUFF: Cable Lacing Tutorial ::: What Is ZFS? ::: mincss Primer ::: LSI RAID Card Flashing Tutorial
FORUM INFO: Community Standards ::: The Moderating Team ::: 10TB+ Storage Showoff Topic

Link to post
Share on other sites

I don't think there's much to do than thank you for sharing this. Such an useful tool! I'm not working with websites anymore but I'll surely keep this in mind for a future project.

Link to post
Share on other sites
Posted · Original PosterOP

Happy to be of service. I'm not currently doing any web dev'ing either, but

it definitely is a nifty little tool which I'll keep in mind as well. :)



BUILD LOGS: HELIOS - Latest Update: 2015-SEP-06 ::: ZEUS - BOTW 2013-JUN-28 ::: APOLLO - Complete: 2014-MAY-10
OTHER STUFF: Cable Lacing Tutorial ::: What Is ZFS? ::: mincss Primer ::: LSI RAID Card Flashing Tutorial
FORUM INFO: Community Standards ::: The Moderating Team ::: 10TB+ Storage Showoff Topic

Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Recently Browsing   0 members

    No registered users viewing this page.