Hacker News Reader

Comment by h3mb3 | Hacker News Reader

I don't fully understand how this is supposed to be an alternative to Tailwind while not providing utility classes out of the box? Did I miss something in the docs?

To me the biggest benefit of Tailwind, apart from the great base design system, is not needing to come up with class names for 99% of the things in the app. This is of course only possible when you have some way to abstract components out of the reused parts of your markup – e.g. you're using React.

Edit: The title was "Open Props: Tailwind Alternative from Chrome Dev Team" when I posted this comment.

View on HN

It seems like this isn't a Tailwind alternative, that's something the poster made up. I think it would be best for a mod to change the title here.

However, there's a point in using something like BEM (https://getbem.com/) for your class naming scheme, and go away with the utility classes within your HTML. The utility classes from Tailwind (and Bootstrap) provide great consistency, and this seems to provide the same but from within your SCSS itself.

It isn't anything like Tailwind, and nothing in the docs suggest they are positioning themselves as a Tailwind alternative.

https://github.com/GoogleChromeLabs/postcss-jit-props

They did make a companion JIT PostCSS plugin that likely has Tailwind as its forebear.

Likely based on what?

"JIT" as it pertains to CSS is a concept from Tailwind: https://v2.tailwindcss.com/docs/just-in-time-mode

Tailwind did not invent JIT.

Tailwind had to come up with something, and that something is it's JIT compiler, because shipping 10mb to the browser in dev was untenable. Let alone the people that never setup purgecss and were shipping that in production.

Mhm. Agreed. But the specific implementation, and especially the term "JIT" in the CSS space, is from Tailwind, right?

I think WindiCSS came up with it earlier than Tailwind. See https://antfu.me/posts/windicss-and-tailwind-jit

I think it's being compared to Tailwind because it gives you consistent scales - your padding isn't 4px, it's --size-fluid-3.

I agree with you: half of Tailwind's value for me is the scales, and half is that I don't need to create a derivative taxonomy of my app - I just style the thing that needs styling.

To me the biggest drawback of tailwind is having half my styling in HTML and the other half in CSS. This directly addresses that issue by using. CSS to include functionality rather than HTML element class names.

Reply on news.ycombinator.com