4 ms·
I always feel like these naming conventions are just one big workaround for the pain of a global namespace. We should tackle it with tools like CSS Modules[0],
by MatekCopatek 11y ago
I always feel like these naming conventions are just one big workaround for the pain of a global namespace. We should tackle it with tools like CSS Modules[0], not with something as flimsy and error-prone as a naming convention.
[0] https://github.com/css-modules/css-modules https://github.com/css-modules/css-modules
- Zikes 11y agoShadow DOM[0] is a big step in the right direction, as well. [0] https://w3c.github.io/webcomponents/spec/shadow/ https://w3c.github.io/webcomponents/spec/shadow/
- octref 11y agoIn another comment[0] I also mentioned using Shadow DOM for modularizing CSS. However I got a comment "Shadow DOM is not the solution for CSS isolation for components." and the commenter referred me to css-modules. I'm wondering what's the merit/advantages of using css-modules over using Shadow DOM to limit the scope of CSS rules. [0]: https://news.ycombinator.com/item?id=10453076 https://news.ycombinator.com/item?id=10453076
- Zikes 11y agoShadow DOM enforces CSS isolation incidentally, but is also part of the larger "web components" plan, which would also incorporate CSS modules. In these cases you would fully encapsulate CSS, HTML, and JS on a per-component basis.
- bpatrianakos 11y agoCSS is not a programming language. You can't think about it the same way you'd think about your backend code or even client side JS. The global namespace is by design. It's a feature, not a bug. The whole point is to think about the Cascade. You go from vague to specific and that way you have entire classes of elements with base styles and specific components have additional styles attached. CSS modules is a cool idea but I don't think there's anything wrong with CSS as it stands today. When you work in any language you need to understand and work with the language you have and I think that a lot of criticism of CSS boils down to "CSS doesn't work like this other language/paradigm I know and like".
- MatekCopatek 11y agoI humbly disagree. No, CSS isn't a programming language, but that doesn't mean it can't use functionalities that are typical of programming languages - just look at variables, functions, arrays, maps and other features that preprocessors like SASS have brought us. While some approaches are a matter of taste/habit, I think there's an extremely wide consensus that having everything available in global scope is bad. If the global namespace really is by design, then why are we adopting conventions (such as the one in this very topic) that mostly aim to defeat it? Prefixing class names to apply them only to a specific component is nothing but a primitive way of limiting scope.