DropCSS

DropCSS: Analyzes and Removes Unused CSS

A Chrome extension that instantly reduces file size and improves performance by identifying and removing unused CSS selectors on a webpage

What is DropCSS?

DropCSS is a Chrome extension that analyzes unused CSS selectors on a webpage and removes them instantly to reduce file size and improve performance. It scans the HTML and CSS code to detect selectors that are not used or referenced on the page. This helps eliminate unnecessary code that is slowing down webpage load times.

Once installed, DropCSS will run automatically when you load up a webpage. It will parse the HTML and CSS files, identify selectors that are not applied to any elements on the page, and remove those selectors from the CSS file. This trimmed down CSS is displayed instantly without needing a page reload.

DropCSS is useful for web developers and designers who want to optimize their webpages. Over time as codebases grow, unused CSS selectors accumulate which cause page bloat. This extension saves the time and effort of manually analyzing CSS usage and cleaning up selectors. Within seconds of loading a page, DropCSS scans the entire CSS file, removes unused code, and delivers a faster, lighter page.

The extension provides detailed reporting on how much CSS was removed from each page. Developers can use this to identify areas where CSS rules have pile up unnecessarily. DropCSS is available as a free Chrome extension and works well in conjunction with other performance optimization tools.

DropCSS Features

Official Links