I know there is an extension called Dust-Me Selectors for Firefox and also that it doesn't look at dynamic HTML generated by JavaScript.
I'm looking for tool(s) that can identify all unused selectors from a stylesheet, attached to several pages, with all the JavaScript running and checking selectors? The only option I know right now for this is manually checking files and finding unused selectors :(
In IDE's - I believe NetBeans provides a warning message when writing Java code, if a library is not under use. Without an IDE (NetBeans, Eclipse, Dreamweaver, etc) plugin to search for the selectors what are my options?
Also, is there a tool to check for unused selectors in the same file. I mean if all the JS, HTML and CSS code is in the same file.
The Coverage tab in Chrome DevTools can help you find unused JavaScript and CSS code. Removing unused code can speed up your page load and save your mobile users cellular data.
If you want to remove unused CSS entirely, you can use a tool such as PurifyCSS to find out how much CSS file size can be reduced. Once you get the CSS code you should eliminate, you have to remove it manually from the page.
Open the Code Coverage Tab in Google Chrome and view per CSS file which declarations you do not need. Open the CSS file on the server (or locally) and check each unused CSS declaration . Determine whether it can be removed.
I think that http://unused-css.com will do exactly what you want.
https://github.com/geuis/helium-css can help
as well as: http://razorfast.com/2010/11/21/announcing-cssess-the-bookmarklet-that-finds-unused-css-selectors/
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With