How to detect unused CSS style definitions
As your web app project & the team size gets larger, there is a chance that the CSS style definitions within the stylesheets grow uncontrollably due to lack of coordination among the developers. This could lead to duplicate style definitions & gradually this could impact web page performance.
Luckily, there are tools to detect unused CSS selectors per page & weed them out manually -
- Dust-Me Selectors is a Firefox Extension (Firefox version 4 is not currently supported) that scans all the definitions inline & within external stylesheets and reports the unused ones.
- Audit tab within Google Chrome Developer Tools (Ctrl+Shift+I) lists unused selectors as part of its performance recommendations
If you enjoyed this article, please consider sharing it!
