Mhh... I don't know how to feel about this. Over the last year, I've shipped a bunch of (p)react components [1, 2, 3] and what is cool about them is indeed tha

Mhh... I don't know how to feel about this. Over the last year, I've shipped a bunch of (p)react components [1, 2, 3] and what is cool about them is indeed that you can now encapsulate a UI function and make it re-usable within your project or even across projects. In theory, this should finally give front end devs the same super powers as backend devs: high reusability. However, a problem that I wasn't able to distinctly address is CSS. Currently, there's simply too many variants of encapsulating CSS into a "react module". You can opt to use: - css modules - styled components and derivatives - CSS in JS or classes in JS, etc. But ultimately, if you build your UI as a patchwork of many integrated UI elements (which IMO should be something legit in frontend development), you'll end up having to include 5 different CSS-in-bla libraries either in your build pipeline or (worse) in your bundle code that you ship to production (bloats the size and hence your app's performance). Long story short: Combining styled components with twin macro and tailwind doesn't make my life easier currently. And the benefits to my users will not be apparent directly either. Not to say that all the CSS-to-XY movement isn't cool. Still, I think the best solution to this problem has yet to be discovered. 1: https://github.com/TimDaub/preact-touchable-dock https://github.com/TimDaub/preact-touchable-dock 2: https://github.com/TimDaub/react-envelope-graph https://github.com/TimDaub/react-envelope-graph 3: https://github.com/TimDaub/react-simple-knob https://github.com/TimDaub/react-simple-knob