Any suggestions to what to use instead? I used Bulma in the past (I'm not an every day frontend engineer)
I'm working on something called CASS that's like Tailwind but easier, with no tooling: https://casscss.github.io/cass/
Tailwind is a leaky abstraction
31–40 of 391 posts
Re: Tailwind is a leaky abstraction
#32The first example provided of building a custom animation is already outside of Tailwind's core use case of rapidly building common UI while only having to look at the markup. The occasional fine-tuning is usually when it's time to step over to your CSS file and write a custom component. Anyone who builds UI for a living, ideally already having a well-developed mental model for how CSS works, immediately understands…
> Anyone who builds UI for a living, ideally already having a well-developed mental model for how CSS works, immediately understands Tailwind's power in my opinion
Just chiming in to say I'm an outlier in this respect. I've been doing front-end focused dev for well over a decade, using every system imaginable, and I'm yet to see the appeal of Tailwind. I have tried it, and many of my use cases are supposed to be what it's best at (rapid prototyping etc), but I still dislike it in many aspects. That's fine though, if it works for other people then all the power to them.
It's likely that because many of the things I'm building are relatively bespoke, and therefore require breaking out of Tailwinds boundaries (like the authors examples), that I haven't gelled with it yet.
Re: Tailwind is a leaky abstraction
#33Tailwind 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 you do it again?
Re: Tailwind is a leaky abstraction
#34I used Tailwind for a year at work, never having used it before. I found it overrated, frankly, and not much of an efficiency boost. We had a "don't use inline styling or your own CSS classes if a Tailwind class already exists" rule. While the reasoning was understandable, it meant that every time I wanted to style or position a component, I had to browse the Tailwind docs to make sure I wasn't duplicating something.…
In your case, you'd be better of grepping tailwind's source. You could even spend some time writing a shell script that turns your proposed style rule into a regexp and runs it wherever tailwind's css file is.
Re: Tailwind is a leaky abstraction
#35You 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, with non-specific css, the coupling is ensured, the css is re-usable, the patterns are re-usable, re-factorable with a single copy paste.
I don't use tailwind yet, but just using exclusively utility classes changed my ease in writing, refactoring, re-using and maintaining code by an order of magnitude.
Re: Tailwind is a leaky abstraction
#36To me, Tailwind is not an abstraction, but a "more convenient" way to write CSS for some projects.
Re: Tailwind is a leaky abstraction
#37I don't like it, too. Funny story: In my early years of development. My boss told me, that I should refactor the css of our application. We had a lot of styles directly in the HTML and I should create a css file with classes, to be able to reuse these classes. At that time I had no clue of css, this project should be a learning by doing. YES... Bad idea... So anyway: I did exactly that, what Tailwind does. I created a whole lot of utility-classes. I remember that our CTO yelled so bad at me, why I did such a braindead thing. I laughed so hard when I looked at tailwind, cause it's always reminding me at that time.
Re: Tailwind is a leaky abstraction
#38You have a shiny new tool called hammer and now everything seems to look like a nail to you. Tailwind is not made to completely ditch css. Its not a replacement, it just tries to make your life easier. At least in most cases in my experience.
Re: Tailwind is a leaky abstraction
#39I've used Tailwind for about 2 months now and I have to say that I think the author misses the point. Tailwind breaks away from having multiple style definitions away from the elements you're working with in your templates/views. With utility classes it is possible to see from the markup what styles are applied right there without having to dig through cascading style sheets that often hide in some bizarre area where the style is actually applied.
Re: Tailwind is a leaky abstraction
#40Tailwind 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 display and business logic. Look at what the frontend has become now with React and Nuxt and the like, basically just PHP all over again. Is that bad? Well, people seem to like it, so I don't think so.
In other words, I totally agree with this article but I've given up trying to make any sense out of the frontend world. Tailwind is for people who don't want to learn CSS[1], which seems like a frighteningly large amount of web devs. But, ultimately, that's OK. I will continue to happily ignore it.
My hope is that will some CSS changes landing soon (in particular :has and nesting selectors) we will see more respect given to CSS as a declarative language for defining UI, instead of just some boilerplate to make your page look pretty.
[1]: see replies below, this is wrong :). nisegami said it much better: Tailwind is for people who don't want to use CSS as it was intended. It's like a simplified execution model for it.