Tamagui setup

[natew]

In general doing the styled(ReactNativeView) will be much slower than doing this:

import { Stack } from 'tamagui'

const TamaguiView = styled(Stack)

Or you can import View from tamagui. This is what the docs recommend. Of course also enabling the optimizing compiler would speed things up a lot more but don't need that mentioned.

I can probably make a case where tamagui recognizes the default RN View and optimizes it a bit more as well, I'll do that in an upcoming release, but I think just the change above is fair.

[ankit-tailor]

Hey @natew, I tried styled(Stack), but it's making it a bit slower than styled(ReactNative). I have created a PR with changes. Let me know if anything is wrong here. I'll re-run the tests again.

[natew]

Missed this reply earlier but I’ll take a look. Tamagui in general will be a bit slower on micro benchmarks without the compiler because it supports a lot of things and also normalizes style properties. But with the compiler on it will be faster. But it should still be very close to most libraries in our testing including nativewind 4 and restyle so something is off maybe just the specific case. Also it should definitely be faster with Stack

[natew]

Have a branch with a variety of changes that improves things, also found that our enabling of memo by default makes it look bad for these smaller use cases, but I've decided that not doing memo by default should be the way to go. In my tests it makes it about equal or better in some cases.

I also tested using the experimental TAMAGUI_OPTIMIZE_NATIVE_VIEWS which further improved it to be closer to styled components. I'm actually surprised they fare so well in my other tests they weren't so much better, but maybe you've set them up better. Gluestack could probably optimize in this way too pretty easily, happy to share some insights there, I'm hoping to land that not behind a flag here soon.

There's like 2-3 more smaller things I can optimize, but the main thing that makes Tama slower is that it expands out things so it can do its fancy variant "order important" merging that imo is really powerful and nice and almost necessary for web. But it requires we "expand" things. So padding becomes paddingLeft etc. I'm surprised to see native seems to slow down quite a bit (~20%) just by doing this, but its more apparent on small benchmarks.

The optimizing compiler gets rid of most the cost though, but I need to figure out why its not working on this repo. Just spend 30m looking at this but I'll come back this weekend or soon. Thanks for setting up some better benchmarks though.

[ankit-tailor]

Appreciate your acknowledgment of the updated tamagui benchmarks. We will review your PR, and please don't hesitate to make any necessary improvements to the benchmarks. We will re-run the tests once your PR is merged and update the benchmarks.