Code Coverage tests every selector in every readable stylesheet against the live page, so you can see which CSS rules currently match nothing, how many bytes each file wastes, and which scripts are holding up first paint.
Stylesheets only grow. A theme arrives with rules for pages you do not have, a framework ships components you never use, and three redesigns later nobody is sure which half of the file is load-bearing. The result is CSS that costs every visitor bandwidth and render time to deliver rules the page cannot use.
Code Coverage measures that directly. It walks every rule in every stylesheet the browser will let it read — including rules nested inside media queries, @supports and @layer blocks — and tests each selector against the live DOM. A rule that matches nothing right now is reported as unused, per file, with a percentage, the wasted bytes, and the full list of selectors you can expand and copy.
It is careful about the obvious traps. Pseudo-elements and state pseudo-classes are stripped before matching, so a :hover or ::before rule is judged on whether its base selector exists rather than being wrongly written off. Stylesheets served cross-origin without CORS headers cannot be read by any script, so they are flagged as unreadable instead of being silently counted as perfect. And because the scan reflects the page as it is at that moment, rules for menus, tabs and modals that are not open yet will look unused — so open them and press Re-scan before you delete anything.
The JavaScript tab answers a different question: weight and blocking. It inventories every script the page loads with its transfer size, its download time, and whether it is async, deferred, a module, loaded dynamically or holding up first paint, then totals how many bytes are blocking. It is deliberately not sold as execution coverage — knowing which JavaScript lines ran requires Chrome's debugger API, which DevSuite Pro does not request, so nothing here pretends to be a line-level report.
Every rule in every readable stylesheet is tested against the live DOM, including rules inside media queries, @supports and @layer blocks — not estimated from file names or sizes.
Each stylesheet gets an unused percentage, a used-versus-unused rule count and the number of wasted bytes, sorted so the worst offender is at the top.
Expand any file to read the selectors that match nothing, then copy them as a CSS block to work through in your editor or hand to a teammate.
Pseudo-elements and state pseudo-classes such as :hover and :focus-within are stripped before matching, so interactive rules are judged fairly instead of being written off.
Every script listed with its size, download time and whether it is async, deferred, a module, dynamically loaded or blocking first paint — plus the total blocking bytes.
Unreadable cross-origin stylesheets are flagged rather than scored, and the JS tab says plainly that it measures weight, not which lines executed. No invented numbers.
A purchased theme ships CSS for dozens of demo layouts. See how much of it your site never uses and cut the file down with evidence rather than guesswork.
Check how much of a CSS framework survives on a real template, and whether your purge or tree-shaking configuration is doing what you think it is.
List the scripts holding up rendering, with their sizes, and decide what to defer, split or drop to get content on screen sooner.
Walk in with numbers: which files waste the most bytes, how much JavaScript is blocking, and where the first hour of work pays off most.
Taking over a site you did not build, get a quick read on how much of its CSS and JavaScript still earns its place.
Click the Code Coverage icon in the DevSuite Pro dock. The scan runs immediately and reports how many rules it checked and what share of them is unused.
The top row gives you stylesheet count, total rules, the unused percentage and the wasted bytes. Files below are ordered by how much they waste.
Click show unused selectors on any file to read exactly which rules match nothing on this page.
Open menus, tabs, accordions and modals, then press Re-scan. Rules whose elements only exist in those states will move from unused to used — always do this before deleting.
Copy unused selectors gives you a CSS block to work through; Export JSON copies the full report, including the JavaScript inventory, for a ticket or an audit document.
Install DevSuite Pro for free and unlock 71+ developer tools for your browser.
