[HN Gopher] Show HN: Tamagui - React design systems optimized fo...
___________________________________________________________________
 
Show HN: Tamagui - React design systems optimized for native and
web
 
Author : nwienert
Score  : 39 points
Date   : 2021-11-23 18:59 UTC (4 hours ago)
 
web link (tamagui.dev)
w3m dump (tamagui.dev)
 
| nwienert wrote:
| Hey HN, author of Tamagui here.
| 
| I've been pursuing something like Tamagui for many years now,
| this is technically my 3rd or 4th iteration on a compile-time
| optimized UI kit depending on how you count.
| 
| The motivation is simple: build apps with less code.
| 
| In react to do this today you have to sacrifice a lot: responsive
| design, themes, and general speed. None of the cross-platform UI
| kits do media queries or themes without resorting to JS, which
| hampers performance. Further, if you want a more modern API for
| themes, typed inline styles, media queries, etc, you sacrifice
| more performance. Our benchmarks[0] comparing Dripsy and
| NativeBase show 3-10x speed improvements, and that's not
| comparing stuff like media queries and themes which should be
| even more favorable.
| 
| Tamagui does all this with an optimizing compiler that lets you
| keep all the slick features without sacrificing performance. The
| compiler pulls out even inline JS logic into CSS on the web, or
| StyleSheet.create on native. It even flattens View/Text into
| div/span.
| 
| All that performance and platform-optimized-behavior makes a big
| difference, especially when building apps as apps tend to render
| many more components! It's also the only cross-platform UI Kit to
| support SSR.
| 
| Happy to answer any questions here!
| 
| There's actually a ton of room for continued improvement, and I'd
| love to set up some sort of sponsorship to keep realizing this. I
| think the current state of React is that it's tremendously
| powerful and well-designed, but actually releasing an app that
| runs on web + native is still a near-Everest type mountain to
| climb, and I hope to continue to change that.
| 
| [0] https://tamagui.dev/docs/intro/benchmarks
 
| Sekhmet wrote:
| Looks like gradient text isn't rendering properly on Chrome,
| because it's missing -webkit- prefix on background-clip.
 
  | nwienert wrote:
  | Thanks, pushed a fix
 
| bilalq wrote:
| This looks really neat! Love the focus on performance for mobile.
| The inclusion of linear gradient is also nice, since I've had to
| write code that seemed stupidly complex to get that working
| cross-platform before.
| 
| I've always been a frustrated by is how difficult it is to build
| a design system for React Native. It seems like no one who's done
| it has really open sourced much in the space. One thing I've
| often found missing is the ability to build an interactive
| showcase of a component library. Do you have any plans for
| something like that?
| 
| On a side note, I am a little skeptical of react-native-web.
| Admittedly, I haven't looked into it much though. Can DOM nodes
| be mixed with react native nodes? If not, the lockout from Normal
| react libs would give me pause. Also not sure if I'd trust it
| with components doing things like charting or animations. I'm
| still in that camp of people finding it easier to write React and
| React Native UIs totally separately.
 
  | nwienert wrote:
  | Thank you!
  | 
  | > Do you have any plans for something like that?
  | 
  | It's a good idea, and in general I think a clear path to
  | generally making frontend much easier so I'll think about it.
  | 
  | > Can DOM nodes be mixed with react native nodes?
  | 
  | Yep, they won't render on native but its totally fine to do if
  | you're just targeting web. Theres only lockout if you want 100%
  | sharing but it's easy enough to fork any component into web and
  | native by having a `.native.ts` file.
 
___________________________________________________________________
(page generated 2021-11-23 23:00 UTC)