I have a legacy stylesheet that is now full of unused styles. The problem is identifying the necessary from the unnecessary. Are there any tools to help with this?
7 Answers
Install Google's pagespeed plugin for firebug:
http://code.google.com/speed/page-speed/
Then in Firebug, open the 'pagespeed' tab and, with 'performance' selected, click 'analyze performance'.
If you have unused style rules on the present page, then along with lots of other useful suggestions, you will see a list item labelled "Remove Unused Css". Click to expand it and see a breakdown by resource of unused css rules appearing on the present page, along with the memory size that you will save by removing the unused rules.
This is just one tiny feature of the pagespeed toolkit, which you definitely familiarize yourself with if you're at all interested in your page performance on the client side.
You may also be interested in yslow, a similar tool for firebug developed by yahoo.
Related