CSS clean-up @ build time
Here is a simple Maven goal to optimize CSS delivery at build time and low cost.
<!-- set path to CSS files -->
<set var="css.cleanup.src.dir" value="path_to_css_files" />
<goal name="cleanup-css" description="Remove comments and blank lines from CSS files">
<echo message="Removing comments and blank lines from files in ${css.cleanup.src.dir}" />
<!--
remove single+multiline comments,
see docs@http://ant.apache.org/manual/OptionalTasks/replaceregexp.html
-->
<replaceregexp byline="false" flags="gm">
<regexp pattern="\/\*(.\s)*?\*\/" />
<substitution expression="" />
<fileset dir="${css.cleanup.src.dir}">
<include name="*.css" />
</fileset>
</replaceregexp>
<!-- remove multiple blank lines -->
<replaceregexp byline="false" flags="gm">
<regexp pattern="^\r\n^\n" />
<substitution expression="" />
<fileset dir="${css.cleanup.src.dir}">
<include name="*.css" />
</fileset>
</replaceregexp>
</goal>
Is it really worth it?
I tested it on 5 CSS files (test1.css, test2.css,test3.css, test4.css, test5.css) of different sizes and obtained a respectable file size reduction. In addition, dev comments are not shipped and exposed to the outside world.
Below is the output of the Python stats scripts I wrote to analyse situations like this (testX_c.css is the compressed version of the original file):
>>> describe(cmpfilesizelist(d, listfiles(d, "*.css")))
file test1.css is 4.57% larger than test1_c.css
file test2.css is 33.40% larger than test2_c.css
file test3.css is 21.93% larger than test3_c.css
file test4.css is 34.55% larger than test4_c.css
file test5.css is 36.54% larger than test5_c.css
('Sample Size: 5', 'Min/Max: ', (4.5725935634192512, 36.543124350536885), 'Mean: 26.20', 'Median: 33.40', 'Std. Dev: 13.37', 'Std. Error: 5.98')
The compressed files also validated on the w3c CSS validator
