| Summary: | Web Inspector: CSS Report: Unused / dead code | ||
|---|---|---|---|
| Product: | WebKit | Reporter: | Joseph Pecoraro <joepeck> |
| Component: | Web Inspector | Assignee: | Nobody <webkit-unassigned> |
| Status: | NEW --- | ||
| Severity: | Normal | CC: | benjamin, graouts, inspector-bugzilla-changes, jonowells, webkit-bug-importer |
| Priority: | P2 | Keywords: | InRadar |
| Version: | 528+ (Nightly build) | ||
| Hardware: | All | ||
| OS: | All | ||
* SUMMARY CSS Report: Unused / dead code. When we do Reports, a useful CSS report feature to have would be warning about unused rules, or dead code within stylesheets. Examples: - warn about unused rules (could be dead code, or could just not be affecting this page) - warn about explicitly dead code, overruled within the styles: "b{color:red} b{color:blue}" => the first rule is dead code and can be eliminated ".a.b{...} .b.a{...}" => more complex, but these two selectors match, possible dead code Doing a quick web search, there are tools that do similar things: - css-eliminator <https://www.npmjs.com/package/css-eliminator> - uncss - <http://davidwalsh.name/uncss> - unused-css - <https://unused-css.com> (I think this actually checks on multiple pages to essentially get code-coverage of a stylesheet across many pages) - cssess - <http://razorfast.com/2010/11/21/announcing-cssess-the-bookmarklet-that-finds-unused-css-selectors/> - helium-css - <https://github.com/geuis/helium-css> - deadweight - <https://github.com/aanand/deadweight> - CSS Scanner - <http://sourceforge.net/projects/cssscanner/>