Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Tailwind is a leaky abstraction

jakelazaroff.com

Post reply on HN
Print view View original

251–260 of 391 posts

Re: Tailwind is a leaky abstraction

#251

Post by EMM_386 »

adamlett wrote: post #26

> 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…

> that you don't have to edit your stylesheets 95% of the time, when you alter the styling of a document

And the problem with editing style sheets when dealing with document style, is?

Re: Tailwind is a leaky abstraction

#252

Post by bastardoperator »

hbn wrote: post #47

These are fairly complex use-cases that aren't needed for 99.9% of CSS people write. In most cases I'm throwing together a handful of components in a flex container or right-aligning some buttons or something. And for that typical CSS usecase, I find Tailwind way better both for quickly iterating and for hopping into code someone else wrote. I love not having to bounce between and cross-reference 2 (or more!) files (…

Exactly. No matter what, this person decided before they even used tailwinds that it was going to be bad. They used their time with the tool to point out obscure cases so they could say "see, I was right, it leaks". They then try to tie together at the end with a "I'm not saying it was bad".

This type of drama or negative style of writing needs to stop. Be objective, there is good and bad everywhere.

Re: Tailwind is a leaky abstraction

#253

Post by atsjie »

pdntspa wrote: post #233
hbn wrote: post #47

These are fairly complex use-cases that aren't needed for 99.9% of CSS people write. In most cases I'm throwing together a handful of components in a flex container or right-aligning some buttons or something. And for that typical CSS usecase, I find Tailwind way better both for quickly iterating and for hopping into code someone else wrote. I love not having to bounce between and cross-reference 2 (or more!) files (…

I've looked at tailwind as an individual, but their pay-for-documentation model is absolutely bullshit. And it doesn't seem to be doing anything different from Bootstrap or 99% of the other CSS frameworks out there. Also, it makes me sad to see people so eager to throw away separation of concerns :( Yes everything describing it is on one screen but now your HTML is filled up with hundreds of words of awful classnames…

Separation of concerns went out of the window a long time ago when frameworks (i.e. React) showed that it's better to combine business logic + markup into a neat encapsulated package.

Having a neatly encapsulated component that does everything is fine in most setups. Your main challenge will be not growing these components too big.

(( I really dislike Tailwind btw, mostly because I am just translating CSS into something else all the time which feels like a waste of mental effort; and the long lines of cryptic classnames is just bizarre to gain such a big popularity. I loathe it, it's a maintenance hell. I imagine all frontend devs liking this grew up using Bootstrap or something and mostly do small projects ))

Re: Tailwind is a leaky abstraction

#254

Post by verisimilidude »

viddi wrote: post #119
adamlett wrote: post #26

> 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…

Maybe I'm going out of a limb here, but wasn't the whole point of CSS to not have to touch the markup when changing the styling? Not trying to talk Tailwind down, I have just missed a lot of the evolution of web design in the past 15 or so years.

That was back when XML was supposed to take over the world. We were going to style the same semantic content for print and web with CSS and/or XSLT. XHTML was the next big thing. Every web page was actually just a page.

We're not living in that future.

But the CSS ecosystem is still useful, and still adapting to our needs today. Tailwind might be considered one of those adaptations.

Re: Tailwind is a leaky abstraction

#255

Post by bliteben »

hbn wrote: post #198
viddi wrote: post #119

Earlier quoted context omitted.

Maybe I'm going out of a limb here, but wasn't the whole point of CSS to not have to touch the markup when changing the styling? Not trying to talk Tailwind down, I have just missed a lot of the evolution of web design in the past 15 or so years.

I've never understood the point of separating markup from the design. I've seen CSS Zen Garden and... neat? But I don't get the point in real-world use. I've never had to redesign a UI in a way where I'd only change CSS and not also be moving around markup in the process. And once you're changing both of those things, there's the overhead of cross-referencing and keeping names and hierarchy in sync. At that point I d…

it really only would make sense if we were serving pure xml and the webpage was the api for literally every webpage.

since that is not the case, tail wind is great, even the biggest complaint about tailwind, bloated html size seems like something you can just compile away.

Re: Tailwind is a leaky abstraction

#256

Post by nailer »

eajakobsen wrote: post #138
pindab0ter wrote: post #123

Earlier quoted context omitted.

How does Tailwind require bouncing between multiple files? Everything is in the HTML in the form of class names. Yes, you will have to know what the classes do, but where that isn't already intuitive it's just a one-off lookup, and then you know. HTML + CSS can simply not be parsed without hoping between multiple files. Unless you inline all of your CSS, of course.

I think the point in the comment you are replying to is that they _prefer_ having markup and styles in separate files.

No, I have HTML and CSS in the same component file. I prefer having styling in one place (the CSS inside the component file) rather than two (the HTML of the component and tailwinds’s own postcss files that implement the styles).

Re: Tailwind is a leaky abstraction

#257

Post by nailer »

ducharmdev wrote: post #212
nailer wrote: post #185

Earlier quoted context omitted.

Regarding the choice of class names: you are using using wrapper elements routinely, outside absolute edge cases like border gradients, you don’t have current CSS skills. As mentioned previously current CSS means you can have a 1:1 match of HTML element to UI element for the vast majority of layouts, no wrappers required. Current gen frameworks will put the styling inside the component so styling is literally a matte…

Ideally all components would be small bite-size pieces, where scrolling down wouldn't be a big deal. But in practice I could still see it being tedious, scrolling through a bunch of classes to find the one you care about. Now if there is a go-to-definition for CSS classes, that would be quite useful. But I appreciate that I don't have to even think about putting a name to my styles with Tailwind.

It’s a login box. There will be a login box, and two inputs, some instructions and a place for errors.

  .login, input.username, input.password, .instructions, .error
If it’s a sea of nested divs, so it’s hard to find the right element (a common pattern among “I just know react” developers), then fix the sea of nested divs.

Re: Tailwind is a leaky abstraction

#258

Post by verisimilidude »

azangru wrote: post #222
lcrz wrote: post #5

> You still need to know CSS. Yes. Tailwind CSS is just CSS: > A utility-first CSS framework It is not a leaky abstraction, because it isn't an abstraction. It's a only a special syntax for applying predefined blocks of CSS to HTML elements.

> Tailwind CSS is just CSS This is simply not the case. In order to use Tailwind, you need to know names of Tailwind classes, which are not part of the CSS standard. To say that Tailwind is just CSS is like saying that Ramda is just javascript.

That doesn't make any sense.

Your classes in your project are not part of the CSS standard either, by your definition.

Tailwind gives you CSS classes that you can use. Yes, you do need to learn them. But that doesn't mean it isn't CSS.

Re: Tailwind is a leaky abstraction

#259

Post by sangnoir »

theturtletalks wrote: post #128
hbn wrote: post #47

These are fairly complex use-cases that aren't needed for 99.9% of CSS people write. In most cases I'm throwing together a handful of components in a flex container or right-aligning some buttons or something. And for that typical CSS usecase, I find Tailwind way better both for quickly iterating and for hopping into code someone else wrote. I love not having to bounce between and cross-reference 2 (or more!) files (…

Tailwind is honestly great for beginners since it "simplifies" CSS into short-hand classes. The people that know CSS don't want to learn new classnames when they can use CSS and that is a standard. I'm personally scared of forgetting CSS if I use Tailwind extensively. I also don't like the aesthetic of all the classnames being bunched together, but Tailwind does have value.

Have you ever had the 'pleasure' of maintaining someone else's non-trivial, non-framework CSS? I have, and it was no fun at all. For all the crap they get, frameworks allow for knowledge transfer across projects/teams/employers.

Re: Tailwind is a leaky abstraction

#260

Post by brianzelip »

More like Tailwind is "not a silver bullet".

When you only work with atomic css for a short period of time and come at it with something to prove like the author, chances are your thinking about it isn't mature and fluid/adaptive.

You don't have to only use single-purpose classes, nor is your work limited to the api surface of Tailwind.

What we do when we bump into dead ends, like the author's reference to `perspective`, is Write CSS. Tailwind makes _extending_ itself as easy if not way easier than other comparable libs (and with _much_ less duplication).

Post reply on HN