Menu
I have a legacy stylesheet that is now full of unused styles. The problem is identifying the necessary from the unnecessary. Are there any tools to help with this?
895
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.
Upon activation, you need to visit the Settings » WP Rocket page and switch to the 'File Optimization' tab. Next, you need to scroll down to the CSS Files section and then check the box next to the 'Remove Unused CSS (Beta)' option.
Eliminating unused CSS is possible using PurgeCSS. It performs static analysis against the source. The functionality can be enabled through purgecss-webpack-plugin. At best, PurgeCSS can eliminate most, if not all, unused CSS rules.
CSS Usage is a great Firefox add-in. You can browse multiple pages and it will work out which rules haven't been used on any of them - so it is more accurate than a tool that scans a single page.
157
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
