css-analyzer
css-analyzer copied to clipboard
Analytics for CSS
See https://github.com/projectwallace/css-selector-browser-h4cks-analyzer/blob/master/test.js for a list of selectors and tests.
We know how many duplicate selectors, atrules and declarations we have, so we should be able to come up with a global duplication number or ratio.
The 2022 Web Almanac made an excellent point about media feature usage. See https://almanac.httparchive.org/en/2022/css#responsive-design List out all features, like `screen`, `min-width`, `prefers-reduced-motion`
AKA steal Bramus' setup from here https://github.com/bramus/specificity/blob/fd29effade145c3e4f3273fc5577a5b10aa229b4/package.json#L8-L42 - [ ] Run tests on bundled package - [ ] Add sub-export for specificity sort - [ ] Add sub-export for selector...
- [ ] Use https://github.com/tinylibs/tinybench instead of our homebrew thing to have it be more reliable. - [ ] Run it in CI and make it fail when we've gone...
Knowing the actual size of the CSS string is only halfway useful. For comparison of data it'd be way more useful if we could 'normalize' the size, like minifying it...
```css -ms-overflow-style: scrollbar; ``` gets reported as a color.
Introduced in https://github.com/projectwallace/css-analyzer/pull/401 but not enough focus on checking the types are exported correctly.
See https://x.com/bramus/status/1793929959075164265?t=VlghVYlR_9-vP7dZKGouOA&s=19