- Optimise loading of modules that are 100% unused on pages. Browsing around en.wikipedia.org logged-out and activating the "Web Page" Audit in Chrome dev tools, I see many modules with style buffers of which 100% of rules are unused.
- Remove unused cruft.
- Better balance modules between conditional and unconditionally loaded code.
- Ensure we consistently use vendor prefixes where we want them, and remove them where we don't need them. For example, we've removed vendor prefixes for border-radius in MediaWiki core a while ago but some extensions still use dated versions of mixins that add moz and webkit variants.
Finding unused CSS
- Chrome > Dev Tools > Audits > Web Page Performance (https://developer.chrome.com/devtools#audits)
- See the items under "Remove unused CSS rules".
- You can use debug mode (?debug=true) to improve some of the source references.
One common source of unused css rules if you see "100% unused" for a particular style bundle, is user gadgets that were enabled by default on a site but are only relevant for logged-in users.
For example, English Wikipedia, has gadget "WatchlistGreenIndicators" enabled by default. But the functionality it applies to is only relevant for logged-in users. For this one the |rights=purge setting is commonly used as a way to restrict a default-gadget to logged-in users only. (example change)
Finding misused prefixes
- Chrome > Dev Tools > Audits > Web Page Performance (https://developer.chrome.com/devtools#audits)
- See the items under "Use normal CSS property names instead of vendor-prefixed ones".