[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)
        
 (HTM) web link (tamagui.dev)
 (TXT) 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)