A complete stack for a modern cross-platform app and website
Takeout is a modern and incredibly robust starting point for building apps and websites that run on every platform - iOS, Android, and web, with React and React Native.
Unlike other cross-platform React Native stacks, Takeout lets you get a perfect 100 Lighthouse performance score on static or server-rendered pages, while still being able to share your entire setup - design system, styling, UI kit, routing, data, etc.
And like the best React Native apps, it also lets you use completely native UI elements specific to each platform as well, easily diverging per-platform as needed.
This incredible ability to render truly high-quality web and native at once is only possible through the combination of two of our in-house pieces of technology: One and Tamagui.
Basecoat diverges from the original template by using LiveStore for local-first data. Feature modules own their LiveStore hooks and mutations, while shared interface components stay data-agnostic across native and web.
Takeout itself achieves some pretty hard feats of integration to achieve a high level of performance and quality. Beyond the deep work Tamagui made to enable high-level web features on native (without performance downside on web), and other hard-fought One features like enabling seamless routing between static, server-rendered, or client pages, Takeout has some impressive architecture.
Some examples of how Takeout achieves a perfect 100 Lighthouse score on static pages:
experimental_scriptLoading,
inlineLayoutCSS, sitemap and more.react-native-web with our own.
react-native-web-lite
which is smaller and can tree shakes many unused parts.