TurboModules
- React Native course
- Advanced
- Lesson 71/83
- 5 min
Learn TurboModules and the new architecture.
TurboModules
TurboModules are part of React Native's new architecture. They replace the classic bridge with JSI (JavaScript Interface). Calls are faster because the bridge's async queue is gone; JS and native communicate directly.
A TurboModule is written in C++ and bound directly to the JS side. Old native modules still work but new modules are written as TurboModules. When the New Architecture is enabled TurboModules become the default. APIs like requireNativeComponent are replaced by JSI-based calls.
The new architecture difference
The new architecture replaces the classic bridge with JSI. In the bridge every call enters a queue and is processed asynchronously; this creates latency. In JSI JS has direct pointer access to native objects; calls are synchronous and fast.
This makes animations and high-frequency events (e.g. scrolling) smoother. When the new architecture is enabled TurboModules are activated automatically; no code change is needed. Old native modules keep running in compatibility mode.
Practice A TurboModule call
Complete the empty file. Import TurboModuleRegistry from react-native (assume it exists). Get the module with const Battery = TurboModuleRegistry.getEnforcing('Battery'). Wrap Battery.getLevel() as export async function.
Starter code
// get the Battery TurboModule and export the getLevel callSample solution
import { TurboModuleRegistry } from 'react-native';
const Battery = TurboModuleRegistry.getEnforcing('Battery');
export async function getLevel() {
return Battery.getLevel();
}Questions and answers
Review the lesson questions together with their answers. To test yourself, solve the lesson interactively.
1 Match the TurboModules parts
| Term | Meaning |
|---|---|
TurboModules |
New architecture |
JSI |
Direct interface |
C++ |
Module language |
New Architecture |
New structure |
2 The new architecture interface
TurboModules uses ____ for direct JS-native calls.TurboModules uses JSI for direct JS-native calls.Explanation: JSI provides direct JS-native communication.
3 What does the new architecture remove?
- Animations
- Styles
- The classic bridge Correct answer
- Components
Explanation: The new architecture replaces the classic bridge with JSI.