Show HN: Tamagui Beta
tamagui.dev
It's quite different from a typical UI kit in that it supports the compiler not only extracts styles at build-time, but also extracts inline styles, even if they use logic like ternaries or conditional spreads. Further, the compiler flattens any styled component completely a div (or View on Native) when it can. I've found that about 20% of our views get flattened completely, leading to much flatter trees, which means really significant performance improvements[1].
This is important not just for performance, but also code-sharing.
Here's the why: If you just took a React Native Web app today and made it responsive using the typical way, hooks, you'd end up with a very janky web app. I know this because Tamagui was born out of an app that did exactly that, and resizing frequently took 300ms+ per frame. Themes today also have the same failure mode - without a compiler, you thread values through context. That means lots more JS to run, and whole-tree re-rendering on every change. Even beyond themes and responsivity, we found ourselves having to really limit our ambition especially for Native - lists that contained many items slowed down quickly after a certain depth.
So Tamagui started solving for themes and media queries and hopefully a bit of tree depth, and it really succeeded at that. To release the alpha I wanted feature parity with modern UI kits, so I added a theme creator, token system, inline token props, media query props, shorthand props (ala tailwind), fonts, and more.
Now over the past 6 months its matured immeasurably with components for gradients, images, inputs, labels, switches, shapes, popovers, and tooltips. Animations just landed, which power many of the new components. "npx create-tamagui-app@latest" to help get started fast. Hundreds of bugfixes and better docs. And one thing I'm really proud of: huge TypeScript type quality and performance improvements.