Don't get me wrong, I appreciate the convenience of this, but I do worry about selector slowdown with what will effectively turn into a regex at some point. I'm dubious that this is needed.
Personally I prefer `class="btn primary"` over `class="btn-primary"` just because it aligns conceptually with what "class" literally means, but I have run into folks that would think it's confusing that there's no top-level .primary rule.
For performance... ehhhh yeah. Nesting and :has() already let you easily slow stuff down if you're not careful. Adding just wildcards, even if they're as restrictive as the blog post talks about, is still going to hang another easy-to-reach footgun on the proverbial wall.
Especially now that there is native nesting, these prefix selectors really seem like the wrong way to go.
https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/S...
[class^="btn-"], [class*=" btn-"]
*[class*=btn-] { ... }
Like, the issue of `some-other-btn-primary` also matching the rule is pretty inconvenient, but definitely tolerable if people preferred writing style rules like this.
The increased level of power HTML, CSS and JavaScript have now is honestly kinda insane.
> The Class Prefix Selector is currently limited to hyphen-separated prefixes, at least at first. Other separators, like _, might be added as possibilities in the future as we receive request from authors like yourself about what would be needed.
I'm sorry, but how did they think this a good idea? Why treat the hyphen with special qualities over any other non-whitespace separator? The argument around "accidental overselection" seems pretty weak to me. If you're using a character with known special properties like the asterisk in CSS then you should understand you're wielding a more powerful hammer implicitly.