Performance
TrapCSS is the fastest and the most efficient css cleaner as proved by the benchmark.
test.html
- 18.8 KB minified
- 502 dom nodes via
document.querySelectorAll("*").length
styles.min.css
- 27.67 KB combined, optimized and minified via clean-css
- contents: Bootstrap's reboot.css, an in-house flexbox grid, global layout, navbars, colors & page-specific styles. (the grid accounts for ~85% of this starting weight, lots of media queries & repetition)
| lib size w/deps | output size | reduction | time elapsed | unused bytes (test.html coverage) | |
|---|---|---|---|---|---|
| TrapCSS |
58.4 KB 6 Files, 2 Folders |
6.58 KB | 76.15% | 21 ms | 575 / 8.5% |
| UnCSS |
13.5 MB 2,829 Files, 301 Folders |
6.72 KB | 75.71% | 385 ms | 638 / 9.3% |
| Purgecss |
2.69 MB 560 Files, 119 Folders |
8.01 KB | 71.05% | 88 ms | 1,806 / 22.0% |
| PurifyCSS |
3.46 MB 792 Files, 207 Folders |
15.46 KB | 44.34% | 173 ms | 9,440 / 59.6% |
Notes
- About 400 "unused bytes" are due to an explicit/shared whitelist, not an inability of the tools to detect/remove that CSS.
- About 175 "unused bytes" are due to vendor-prefixed (-moz, -ms) properties & selectors that are inactive in Chrome, which is used for testing coverage.
- Purgecss does not support attribute or complex selectors: Issue #110.
A full Stress Test is also available.
 |
© Art Deco™ 2020 |