Turbo Modules — 새 아키텍처의 네이티브 인터페이스
Turbo Modules는 Bridge 대신 JSI(JavaScript Interface)를 사용하여 네이티브 함수를 동기적으로 호출합니다.
기존 Native Modules의 한계(비동기 JSON 직렬화, Bridge 병목)를 해결하기 위해 등장한 새 아키텍처의 핵심 요소입니다.
기존 Bridge vs JSI
기존 아키텍처:
JavaScript → JSON 직렬화 → Bridge → JSON 역직렬화 → Native
(비동기, 오버헤드 발생)
새 아키텍처 (Turbo Modules):
JavaScript → JSI → Native (직접 참조)
(동기/비동기 선택 가능, 오버헤드 최소)
핵심 차이
| 항목 | Native Modules | Turbo Modules |
|---|---|---|
| 통신 방식 | Bridge (JSON 직렬화) | JSI (직접 참조) |
| 호출 방식 | 항상 비동기 | 동기/비동기 선택 |
| 초기화 | 앱 시작 시 전부 로드 | 필요할 때 지연 로드 |
| 타입 안전성 | 없음 | Codegen으로 타입 생성 |
| 성능 | 중간 | 높음 |
면접에서 "React Native의 새 아키텍처를 설명해주세요"라는 질문에는 JSI, Turbo Modules, Fabric을 키워드로 답하면 됩니다.
Turbo Module 작성 (TypeScript Spec)
// specs/NativeBatteryModule.ts
import type { TurboModule } from 'react-native';
import { TurboModuleRegistry } from 'react-native';
export interface Spec extends TurboModule {
// 동기 메서드
getBatteryLevelSync(): number;
// 비동기 메서드
getBatteryLevel(): Promise<number>;
// 이벤트 관련
addListener(eventName: string): void;
removeListeners(count: number): void;
}
export default TurboModuleRegistry.getEnforcing<Spec>('BatteryModule');
Codegen
TypeScript Spec에서 네이티브 인터페이스 코드를 자동 생성합니다.
// package.json에 codegen 설정
{
"codegenConfig": {
"name": "AppSpecs",
"type": "modules",
"jsSrcsDir": "specs",
"android": {
"javaPackageName": "com.myapp"
}
}
}
지연 로딩의 장점
기존 (Native Modules):
앱 시작 시 → 모든 모듈 초기화 → 시작 시간 증가
Turbo Modules:
앱 시작 시 → 최소 모듈만 로드
BluetoothModule 필요 → 그때 초기화
CameraModule 필요 → 그때 초기화
→ 시작 시간 단축
마이그레이션
기존 Native Module을 Turbo Module로 전환하는 단계:
- TypeScript Spec 작성 — 모듈 인터페이스 정의
- Codegen 실행 — 네이티브 인터페이스 코드 생성
- ** 네이티브 코드 수정** — 생성된 인터페이스 구현
- JavaScript 호출 코드 수정 —
NativeModules→TurboModuleRegistry
// 기존
import { NativeModules } from 'react-native';
const { BatteryModule } = NativeModules;
// 새 아키텍처
import NativeBatteryModule from './specs/NativeBatteryModule';
const level = NativeBatteryModule.getBatteryLevelSync(); // 동기 호출 가능!
정리
- Turbo Modules는 JSI를 통해 Bridge 없이 네이티브 코드를 직접 호출 합니다
- 동기 호출 이 가능해져 성능이 크게 개선됩니다
- 지연 로딩 으로 앱 시작 시간이 단축됩니다
- TypeScript Spec과 Codegen 으로 타입 안전한 네이티브 인터페이스를 생성합니다
- 2024년 이후 새 프로젝트에서는 새 아키텍처가 기본 활성화됩니다
댓글 로딩 중...