Benchmarks

Performance tests and comparisons.

We've forked a common test suite for styling libraries. All tests were run in a production environment on a Macbook M1 Pro (2021). The benchmarks  are open-source.

Tamagui truly shines with inline styles, themes and media queries, which are key to sharing between native/web, but these tests don't show much of that. The plan is to add one more more realistic and mixed benchmark which really tests a typical complex app page. We think this test will be even more favorable for Tamagui.

Like all benchmarks, these are micro and may have bad performance due to errors on our part. We welcome any improvements to other library implementations.

Legend: RNW = react-native-web, SC = styled-components

Simple component

Timing rendering a simple custom component.

Tamagui

0.018ms

RNW

0.057ms

Dripsy

0.042ms

NativeBase

0.67ms

Stitches

0.023ms

Emotion

0.041ms

Updating variants

Changing variants is fast at runtime, and even faster when compiled:

Tamagui

0.02ms

RNW

0.063ms

Dripsy

0.108ms

NativeBase

0.73ms

Stitches

0.037ms

Emotion

0.069ms

SC

0.081ms

Since styled-components and Emotion don't offer a first-class variant API, this was done via prop interpolation.

Updating inline styles

Tamagui has a big advantage for inline styles, it's the only library to compile them and flatten the tree.

Tamagui

0.025ms

RNW

0.06ms

Dripsy

0.266ms

NativeBase

0.8ms

Stitches

0.027ms

Emotion

0.047ms

Dynamic styles (no compilation)

React Native compatible components are far more feature-rich than web-only, and these next two tests show a really extreme case where nothing can be optimized. We left them in to be up-front, but don't think they represent anywhere near a common use case.

Tamagui

31ms

Dripsy

57.5ms

Stitches

14.5ms

Emotion

49.01ms

Note: This test was taken from the styled-components benchmarks .

Mounting deep tree

In this test, we mount a tree with many nested nodes.

Tamagui

18.61ms

Dripsy

44.43ms

Stitches

8.32ms

Emotion

42.49ms

SC

51.4ms

Note: This test was taken from the styled-components benchmarks .

Summary

Tamagui greatly increases render performance and compares well to even the fastest web-only style libraries.

Tamagui should dramatically outperform other libraries for both media queries and themes, which we will publish in upcoming tests.