google stylesheet compiler CSS renaming

Question

Currently, I'm using Closure Compiler just on the javascript file. Now I also want to minify and rename the CSS classes with shorter names.

Is there a way to avoid having to rewrite every jquery CSS string-based selector in my .js file (ie. $('#SomeID') or $('.SomeClass')) to a variable-based selector? Since most of the HTML is actually generated at runtime, I could easily moved the skeleton HTML that's initially in the page to the .js file and have the document.ready function first put the skeleton HTML needed for the app on the page. Would that avoid the rewriting of the CSS selectors or would the selectors still need to be rewritten as properties of an object?

The doc is here but I didn't find it clear http://code.google.com/p/closure-stylesheets/#Renaming

Thanks for your suggestions.

Answer 1

The short answer to your question is "no there isn't".

Given that you've specified that you're using jQuery selectors here, we can see that any tool for this job would need to rewrite your all three of your HTML, CSS and JS code.

The JS code in particular will be very tricky, because of the possibility of building the jQuery selectors using substrings - eg $('#prefix_' + suffix). I don't know if you've done that kind of thing or not, but the ability to do it makes it virtually impossible to write a completely reliable tool that can rename your IDs and classes, but still have your JS code work correctly. If your code is relatively simple, it may be possible to write it so that it would work for you, but no-one is going to release a tool for general use that would break so easily.

In addition, I don't believe that such a tool would be particularly useful. It sounds like a case of excessive optimisation.

Optimisation is great -- it's good to make an effort to make your site as fast as possible. But one of the key arts of good optimisation is to optimise the areas where you are slowest. I would be extremely surprised if the major bottleneck in your code is the length of your class names.

My advice therefore is to spend your time finding out where the real bottlenecks are in your code, and deal with those. The effect is likely be far greater than all the minification efforts you've done in total so far.