Re:Tailwind Is a Leaky Abstraction
by theturtletalks on Tuesday November 29, 2022 @11:10AM
(#33789340)
This is not the way either. I use CSS-in-JS which has its own flaws, but CSS stays with the component.
[ Parent
| on HN ]
That's why the wink ;)
I used to sort of like CSS-in-JS, but on larger projects it also quickly devolves into "I know we have a design system, no idea what we have there, here are one-off CSS styles for this particular component"
Everything is with its trade-offs alas sigh
I'm curious, if you're using CSS-in-JS already why not jump to tailwind? Its slightly more restrictive, but I've found the more opinionated style incredibly helpful.
What are the benefits you're getting from CSS-in-JS?
Re:Tailwind Is a Leaky Abstraction
by theturtletalks on Tuesday November 29, 2022 @12:28PM
(#33790468)
I use Mantine[0] which uses Emotion[1] for styling. I like keeping the CSS properties in a neat JSON object instead of a long string like Tailwind does. With the object approach, conditional styling is easier too. With Tailwind, you have to use cx or another package to do this and it makes the code a little hard to read.
Emotion isn't without it's flaws though. The company that created Emotion doesn't use it anymore because of runtime overhead[2] so Tailwind may be the future after all.
[1] https://emotion.sh/docs/introduction
[2] https://www.infoq.com/news/2022/10/prefer-build-time-css-js/...
Re:Tailwind Is a Leaky Abstraction
by satvikpendem on Wednesday November 30, 2022 @07:25AM
(#33799722)
Vanilla-Extract is CSS-in-TS that compiles to raw CSS.