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

21–30 of 391 posts

Re: Tailwind is a leaky abstraction

#22

Post by pistoriusp »

dylanhassinger wrote: post #8

Agree 100%. I wish there was a lightweight utility framework that is truly just shorthand, i.e. if I know the CSS property I can predict what the class name would be. With Tailwind it's all arbitrary

Are you using a code editor plugin that surfaces the correct classes? There's no guess work involved.

Re: Tailwind is a leaky abstraction

#23

Post by enraged_camel »

I 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. And Tailwind docs... let's just say they leave a lot to be desired.

Re: Tailwind is a leaky abstraction

#24

Post by bongobingo1 »

pistoriusp wrote: post #19
faebi wrote: post #15

Sometimes I wonder why we don‘t use inline css more often instead of tailwind.

What would be the difference?

Performance, brevity.

TW classes are a lot more concise and provide a "design system" vs raw values and browsers are good at applying classes vs parsing inline styles for every element.

Re: Tailwind is a leaky abstraction

#25

Post by parhamn »

For inline CSS, I love Styled-System [1] for css as props. My components die and get redesigned too frequently to care for anything else. So I prefer them encapsulated in the Component itself.

I find css-as-props is better than a huge string of classes, as it much more readable and statically analyzable. I wonder if anyone is working on a successor to styled-system (though it works fine).

[1] https://styled-system.com/

Re: Tailwind is a leaky abstraction

#26

Post by adamlett »

> 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 document.

When Tailwind does fall short because it doesn't provide the exact CSS feature that is needed to solve the problem, it still provides a template for how to solve the problem: Using one-rule utility classes, that are named for what they do, not for how they are meant to be used.

Re: Tailwind is a leaky abstraction

#27

Post by dstroot »

rozenmd wrote: post #6

Tailwind 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.

This. Tailwind and react work very well together. Components then become portable to other tailwind projects. The best part is tailwind then only ships the CSS you actually use to the browser. Much cleaner than older CSS approaches like bootstrap. Has made me much more productive overall.

Re: Tailwind is a leaky abstraction

#28

Post by o_m »

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.

I view it as a subset of CSS that removes the bad parts of CSS
Post reply on HN