React Native: One Codebase, Two Platforms, Zero Compromise
How we use React Native's New Architecture to ship high-performance iOS and Android apps from a single shared codebase.
Building a mobile app used to mean a hard choice: write it twice (Swift for iOS, Kotlin for Android) or accept the performance trade-offs of older cross-platform tools. React Native has fundamentally changed that equation. Across our mobile projects — from taxi booking apps to food delivery platforms — React Native has let us ship production-quality apps on both platforms while sharing 85–95% of our codebase. Here is how we do it, and why it works.
Why React Native Over Flutter or Native?
The cross-platform decision comes up on every mobile project. We evaluated all the major options:
- Native (Swift + Kotlin): Maximum performance and platform fidelity, but doubles development time and cost. Only justified for highly platform-specific apps like camera-heavy or games.
- Flutter: Great UI consistency and performance, but Dart is a smaller ecosystem and the widget layer paints its own UI rather than using native components.
- React Native: Renders real native components (UIView on iOS, View on Android), shares code with our React web teams, and has an enormous JavaScript/TypeScript ecosystem to draw from.
The New Architecture: JSI and Fabric
The old React Native bridge — the asynchronous JSON bridge between JavaScript and native code — was the source of most performance complaints. The New Architecture, now stable and enabled by default, replaces this entirely:
- JSI (JavaScript Interface): Direct, synchronous calls between JS and native — no more serialisation overhead
- Fabric: The new rendering system that aligns the native render tree with React's concurrent features
- TurboModules: Native modules that are lazily loaded and directly referenced via JSI
- Codegen: Auto-generates type-safe native bindings from TypeScript interfaces
Our Shared Codebase Architecture
On a typical React Native project at Net-Crux, the codebase is structured to maximise sharing while isolating platform differences cleanly:
- Business logic, API calls, and state management (Zustand/React Query) — 100% shared
- UI components using React Native's cross-platform primitives — ~90% shared
- Platform-specific files using the .ios.tsx / .android.tsx convention where behaviour genuinely differs
- Navigation with Expo Router (file-based routing, familiar for our Next.js developers)
- Shared TypeScript types between the mobile app and our Node.js backend
Expo: Our Development Toolkit
We build on Expo's managed and bare workflows depending on project requirements. Expo gives us over-the-air updates (ship bug fixes without an App Store review), a rich library of pre-built native modules, and EAS Build for CI/CD pipelines that produce signed App Store and Play Store builds automatically. For clients, this means faster iteration and shorter time-to-fix for urgent production issues.
Real-World Performance: What We See in Production
On our MedyTravels taxi booking app — which involves real-time location tracking, map rendering, and live ride updates — React Native with the New Architecture delivers smooth 60fps interactions and sub-100ms response times on mid-range Android devices. The New Architecture's synchronous layout engine means animations triggered by native gestures no longer have the jank that plagued older React Native versions.
When We Recommend Going Native
React Native is our default, but it is not always the right choice. We recommend native development when the app is deeply hardware-dependent (AR/VR, high-performance video processing, complex Bluetooth peripherals), when the team has strong existing native expertise, or when a client has a single-platform requirement and budget allows the investment.
React Native with the New Architecture is no longer a compromise — it is a genuine first choice for cross-platform mobile development. If you are building a mobile app and want to understand how a shared codebase could reduce your budget without cutting corners on quality, reach out to the Net-Crux team.
Want to build something together?
Let's Talk