Recently, I finished my undergraduate honors thesis in computer science entitled, “Applying Formal Concept Analysis to Cascading Style Sheets.” It’s a successful attempt at optimizing CSS using a technique called Formal Concept Analysis. Note that this is not a minifier! This algorithm analyzes the structure of the code and makes optimizations on the structure, not just taking out white space and other syntactic “fluff.”
From a very high level, the algorithm rearranges and restructures selector-declaration pairs into different rule blocks and groups selectors and declarations in different ways. Unfortunately, specificity can get nuked sometimes, so the results should be tested to make sure they are still correct. Also, there are multiple ways to run the optimization, each of which produce very different results, so some thought and analysis is still required when using the algorithm to determine which results work best for the particular input.
One noteworthy result is that I ran the algorithm on a very large (150+ kb) file from a real website and the file was reduced by about 20%. On the other hand, optimizing some CSS files with certain options can also increase the file size. Again, additional analysis is needed both before and after the algorithm is run to get ideal results.
Downloads
Paper: Download PDF
Slides for Talk: View (Note that the slides are web-based, so positioning for some diagrams can be a bit off)
This paper really just skims the surface, and if I were to continue on to graduate school, I would definitely have plenty of room to expand and improve the methods I used for this research.
Soon I’ll get around to making the Java implementation I created public and create a nice little interface for running the algorithm on user input. Ideally, this tool could be used in addition to minification to “compile” CSS, just as JavaScript can be minified and obfuscated to produce smaller file sizes.
