Tailwind is essentially the CSS equivalent of eval’ing a huge string of minified code that is littered throughout your markup. It would be completely unacceptable in any other domain of programming.
Tailwind is a leaky abstraction
51–60 of 391 posts
Re: Tailwind is a leaky abstraction
#52Tailwind has made building components in React an absolute joy for me. I don't need to scroll up to find my css-in-js definitions, I don't need to change windows to find the CSS modules, it's all there, in one place.
After trying out Tailwind in one pet project I have to say that for larger teams it should not be used. Looking at the code now I get the feeling that maintenance would be a big problem. A bigger project with multiple pages having full on Tailwind css classes peppered everywhere looks to be a nightmare. Does anyone have experience jumping into an existing larger project with legacy tailwind all over the place? Would…
I dont see a problem with big teams at all. You opne up the components HTML and see the styling right there, no doubts in your mind where to edit the styling (no stylesheets to find etc.).
Of course, this requires the team to have disciplin and make proper components so their not copy pasting tailwind classes 100 times
Re: Tailwind is a leaky abstraction
#53Although the author mentions some interesting points the biggest advantage that I find using tailwind is avoiding context switching. Going from the markup to css and then trying to remember what was the name of the class I was working with? And the thing inside, was is just text or a div?
It is true that I can have divs with a ridiculously long class, but that’s the moment that I know is time to make, say, an input component or a card or whatever and move up one layer of abstraction.
There are trade offs for sure but I’ve never been more productive or had less headaches implementing a design than with tailwind.
Re: Tailwind is a leaky abstraction
#54You either use a generic CSS or a generic HTML. Everybody who picks Tailwind decides to use a generic CSS and a specific HTML. I like the old school approach of having a clean and semantically correct HTML without any styling information. And then implement the "theme(s)" in CSS. Makes just more sense to me and goes along with the idea of CSS - separating style and content. But the recent adoption of tailwind make me…
Styling HTML with a few classes and css selectors has drawbacks: you have tightly coupled code that is separated, and modifying one or the others implies that you recalls properly its counterpart. There are methodologies trying to address that, but it never seems to be enough helpful. This becomes even harder when you refactor/reuse things. It is then worse when you want to maintain. With an approach like tailwind, w…
Other than being shorter, what's the benefit of Tailwind over style attributes on HTML tags?
(I am no frontender, though I was a "full stack developer" up to CSS 2.0)
Re: Tailwind is a leaky abstraction
#55This field is extremely fad driven.
Whenever a huge hype wave hits HN, I now just wait for the huge catches to appear... especially if it has anything to do with web platform stuff.
If something hangs around for a long time like Go, Rust, etc. and I see really serious non-hype-driven people buying in, that's when I figure there might be something to it.
Re: Tailwind is a leaky abstraction
#56> But that's kind of the point. Tailwind is a layer on top of CSS, but it doesn't actually hide any complexity in the layer below. You still need to know CSS. This completely misses the point of Tailwind. The point is not to hide the complexity of CSS, but to provide access from the markup to enough of capabilities of CSS that you don't have to edit your stylesheets 95% of the time, when you alter the styling of a do…
[deleted]
Re: Tailwind is a leaky abstraction
#57Tailwind is 100% an antipattern, spitting in the face of well-written CSS. It is essentially a crystallization of the 'utility class abuse' anti-pattern. There is already a well-defined way to write CSS inline, no need to obscure it with 'helpful' utility classes... right? In reality, I don't think that's necessarily a bad thing. When Rails came out, people ranted about how PHP was bad practices because it mixed disp…
> Tailwind is for people who don't want to learn CSS
I wholeheartedly disagree with this. You need to understand CSS to be able to use tailwind. Tailwind's class names are close (most of the time identical, even!) to the pure css equivalents. Furthermore, concepts like flex and grid need to be understood to produce what you want.
Re: Tailwind is a leaky abstraction
#58Tailwind has made building components in React an absolute joy for me. I don't need to scroll up to find my css-in-js definitions, I don't need to change windows to find the CSS modules, it's all there, in one place.
I hope what you describe will eventually be true for me, but so far the purported benefit of not jumping around isn't being realized. After 5 weeks of using Tailwind every day, I still have to switch between my file and the Tailwind docs fairly often to look up whatever shortcut classes I need.
So far I just miss CSS modules. Having my .tsx and .scss files both visible in split screen wasn't so bad.
Re: Tailwind is a leaky abstraction
#59I haven't actually used tailwind yet.
But writing CSS -- usually with SCSS, sometimes bootstrap, sometimes just totally DIY -- I have _never_ managed to keep my CSS well organized. It always eventually becomes an unholy spaghetti mess, including overrides of overrides.
So my interest in tailwind or "utility" approach generally (I have started using bootstrap utility classes more), is not to avoid having to know CSS, but to avoid having to write CSS that I don't know how to keep from turning into an unmaintainable unperformant mess.
(It makes me feel ashamed. I feel like I'm pretty good at writing maintainable code normally. But when it comes to CSS, I have never managed to learn how.)
I do see how you have to know more in some ways, and have two levels of abstraction to debug or reverse engineer when looking at existing code -- tailwind and the underlying CSS, which, yes, pokes through the abstraction. It does seem like describing tailwind as a "language" basically right. That "cost" may well be worth it though.
Re: Tailwind is a leaky abstraction
#60Tailwind is a high level language on top of CSS. It groups expected behaviors into groups that are applied through classes or directives. So in that sense it is an abstraction. However, it is as leaky an abstraction as preprocessor elements, native code elements in other high level languages. If you want to do advanced stuff, you can either fall back to "native code" in CSS or use some "meta-programming" through classes.
I've been using Tailwind for all my recent projects and it is an absolute gift. Yes, it doesn't take away the need to learn CSS, but it takes away a lot of the tedium in producing behaviors that are expected in modern websites. I used the lovely clay[1] library a lot to handcraft CSS before I started using Tailwind and I don't think I want to go back.