What is React Native?
React Native builds iOS and Android apps from one JavaScript and React codebase with real native UI. How it works, trade-offs, Expo and backend testing.
What is React Native?
React Native is an open source framework, created at Meta, for building iOS and Android apps with JavaScript (or TypeScript) and React. You write components once, and React Native renders them as the platform's own native views, not as a web page inside a wrapper. Your app logic runs in a JavaScript engine, Hermes by default, and talks to the native side to draw the interface and use device features such as the camera. That is why a React Native app looks and scrolls like a native one while most of its code is shared between platforms.
How React Native works
- JavaScript layer. Your components, state and business logic run here, on the Hermes engine. Hermes is the default, and release builds precompile your JavaScript to bytecode to improve startup.
- Native layer. Platform views and APIs: UIKit on iOS, Android Views on Android.
- JSI. The JavaScript Interface lets JavaScript hold a reference to a native C++ object and call it directly. It replaces the old asynchronous bridge that passed serialized messages between the two worlds.
- Fabric and TurboModules. Fabric is the renderer and TurboModules are the native modules built on JSI. Together with JSI they form the New Architecture, which became the default for new projects in React Native 0.76. It was available as an opt-in from 0.68, and existing apps can still switch it off. Enabling it does not speed up an app by itself, and some code needs changes to benefit from it.
- Native modules. When the framework does not expose a platform feature, you write Swift, Kotlin or C++ and call it from JavaScript, or use a community library that does.
React Native and Expo
You can run React Native on its own, but the official docs recommend starting a new app with a framework, and Expo is the one they feature. Expo adds file-based routing, a set of maintained libraries and config plugins that change native projects without you editing native files. A new project starts with npx create-expo-app@latest. Without a framework you assemble navigation, native APIs and build setup yourself. Expo does not replace React Native: your app is still a React Native app.
Example
A food delivery startup with one React web team builds its customer app in React Native. The team reuses its TypeScript models, API client and state logic, writes screens with React Native components, and ships to both stores. The map and payment sheet use native modules. Launch week then sends a surge of requests to the same backend that serves the web app, so the real risk sits behind the screens, in the API.
What React Native is good at
- One codebase for two platforms. Most logic and many screens are shared.
- Teams that already know React. Components, hooks and state carry over from React on the web.
- Fast iteration. Changes appear in a running app without a full native rebuild.
- Typical product apps. Content, commerce, social and productivity apps fit well.
Where it struggles
- Heavy graphics and real-time work. AR, games and demanding animation often need native code.
- New platform features. New iOS or Android APIs usually need a native module or library update before JavaScript can use them.
- Library quality varies. Check that a package is maintained and supports the New Architecture before you depend on it.
- Debugging across layers. A crash can involve JavaScript, the native layer and the platform.
React Native vs Flutter vs native
- React Native: JavaScript or TypeScript with React, rendered with the platform's native views. A natural fit for React teams.
- Flutter: Dart, with its own rendering engine that draws the UI itself, which gives the same look on both platforms. See Flutter.
- Native (Swift and Kotlin): two codebases, full access to every platform feature on day one, and the most work to maintain.
Common mistakes
- Assuming iOS and Android behave the same. Text rendering, scrolling, permissions and keyboard handling differ. Test on both.
- Skipping release-build testing. Debug builds are much slower and hide real startup and memory behavior.
- Adding unmaintained libraries. One abandoned dependency can block an upgrade.
- Not uploading source maps to the crash reporter. Without them stack traces are unreadable.
- Testing only the UI. Slow or failing APIs make the best interface feel broken.
Testing a React Native app's backend
UI tools such as Detox and Maestro test the app itself. The network side is a separate job. Mobile clients retry, burst on launch and run on slow connections, and they all hit your API. LoadFocus API monitoring checks your endpoints on a schedule from multiple locations and alerts you when they slow down or fail, which is the earliest warning for an app whose users blame the app. Before a launch or a campaign, load testing shows how that backend behaves under many concurrent users. Use API monitoring as the always-on check and load tests for planned peaks. For worked examples, read the mobile app load times case study and why performance testing matters for mobile-first businesses.
FAQ: React Native
Is React Native the same as React?
They share the same core ideas: components, props, state and hooks. React renders to the browser DOM, while React Native renders to native mobile views, so the building blocks differ (View and Text instead of div and span).
Is the New Architecture the default?
Yes, for new projects since React Native 0.76. Existing apps can still opt out with a setting in the Android and iOS project files, as described in the React Native docs.
Do I need Expo to use React Native?
No, but the React Native docs recommend using a framework for new apps and feature Expo. You can still use React Native without one if you want to manage the native projects yourself.
Does a React Native app produce real native apps?
Yes. The result is an installable iOS or Android app that renders native views. Your JavaScript runs inside it on the Hermes engine.
Can I share code between a React web app and a React Native app?
Business logic, hooks, API clients and types are easy to share. UI components usually differ, because web and mobile use different primitives, unless you use a layer such as React Native Web.
Related terms
Related LoadFocus Tools
Put this concept into practice with LoadFocus, the same platform that powers everything you just read about.