Live data from Hacker News

Tailwind is a leaky abstraction

jakelazaroff.com

321–330 of 391 posts

Re: Tailwind is a leaky abstraction

#321
I don't really get Tailwind. Whenever I am looking at a layout, I am doing it in the inspector tools, not in the stylesheet or the html file. I don't care if the class is called top_bar or foo_bar or if the styling is done inline. I do care that is had a border-radius of 10px,. With tailwind I have to somehow know that border-radius is supposed to be "rounded". I have to learn a whole new language and constantly translate back and forth.

A lot of people seem to like tailwind though so I am probably missing something.

Re: Tailwind is a leaky abstraction

#322
Oh boy. This is a fascinating read. I wrote about Tailwind css as an abstraction layer. But I use some of the same reasons as OP to convey why it is great.

This really was an interesting read. It shows the same thing can be seen as good and bad by different folks.

Link: https://www.unsungnovelty.org/posts/05/2022/explaining-what-...

Re: Tailwind is a leaky abstraction

#323

>Tailwind is a Leaky Abstraction Yes! Yes it is! And that doesn't matter a single hoot! Go and write your complex CSS to do your perspective shenanigans, that's absolutely fine. Don't be a purist who MUST HAVE UTILITY CLASSES AND ONLY UTILITY CLASSES. And you can't, and shouldn't, write tailwind while being ignorant of CSS. You've set up a strawman and knocked it's head off, but I can clearly see you boxed a scarecro…

pardon me, sir, but it feels like you haven't felt the pain of leaky abstractions. hopefully never will

Re: Tailwind is a leaky abstraction

#324
post #308

Earlier quoted context omitted.

It's not like the `style` object is far away. Nothing about Tailwind prohibits you from using normal classes.

Yes tailwind let's you reach through and apply some CSS directly. Almost like its an abstraction that exposes, or leaks, that which it attemps to abstract. A "leaky abstraction" if you will.

Honestly - I find this opinion misguided. It's like saying a for loop is a leaky abstraction over a while loop.

Which... is asinine. One is simply a redacted and simplified expression of the most common implementation of the other case.

Tailwind falls into the same bucket - in my opinion. Like most frameworks, it's not there to handle your niche and complex use-cases. It's there to provide bumpers that push you into a pit of success for common use cases.

When you need to do something that's not common - use the escape hatches that are built in. That's not leaking - that's giving you the flexibility to fall back to a custom implementation.

The goal just isn't "abstraction" from css. It's common-sense, local, and consistent styling for common cases. I can build most lego sets from single square blocks - but it's nice to have a bigger selection available. Does that mean I need to understand those bigger pieces to make sure they fit, don't have weird gaps, and line up? Absolutely. Does that mean I shouldn't use them? No, probably not. But it does mean that sometimes I still need single square blocks.

Re: Tailwind is a leaky abstraction

#327
I think this is kind of unimportant, if you want to improve your experience developing frontends, establish a design system in close collaboration with the designers (use something like atomic design for example) and build abstractions that implement the design system around a component-based architecture. I feel like that's much more important to think about than whatever particular CSS framework you use. Also think about how you are going to optimize for LCP/FID/CLS (core web vitals), its gonna be hard optimizing that later.

Re: Tailwind is a leaky abstraction

#328
post #310
post #241

Earlier quoted context omitted.

> Also, it makes me sad to see people so eager to throw away separation of concerns I don’t think it has ever lived up to expectations, HTML+CSS in that way is simply broken. You can’t really write CSS without hard-coding the HTML structure, so you might as well do it in one file.

I fought against this for a long time, but I have to agree. CSS right next to your HTML/Components makes it a lot easier to keep track of. Maybe it would've been possible to build tooling around using CSS files that created the same benefits, but now we just don't have to any more.

Honestly a style tag always seemed like a pretty good idea for local styling, despite pretty universally being condemned as "the wrong way".

Re: Tailwind is a leaky abstraction

#329

I don't really get Tailwind. Whenever I am looking at a layout, I am doing it in the inspector tools, not in the stylesheet or the html file. I don't care if the class is called top_bar or foo_bar or if the styling is done inline. I do care that is had a border-radius of 10px,. With tailwind I have to somehow know that border-radius is supposed to be "rounded". I have to learn a whole new language and constantly tran…

> I have to somehow know that border-radius is supposed to be "rounded".

Yeah I agree with you there. If you're writing tailwind you have to constantly have the tailwind docs site open.

Re: Tailwind is a leaky abstraction

#330
post #308

Earlier quoted context omitted.

It's not like the `style` object is far away. Nothing about Tailwind prohibits you from using normal classes.

Yes tailwind let's you reach through and apply some CSS directly. Almost like its an abstraction that exposes, or leaks, that which it attemps to abstract. A "leaky abstraction" if you will.

Tailwind is just css classes. It was never meant to abstract anything.
Post reply on HN