React Native 앱 실행 과정
1. 사용자 상호작용
- 사용자가 디바이스에서 React Native 앱 아이콘을 탭합니다.
2. 운영체제 반응
- iOS 또는 Android 운영체제가 앱 실행 요청을 인식합니다.
- 운영체제는 앱에 메모리를 할당하고 실행 프로세스를 시작합니다.
3. 네이티브 코드 초기화
- 앱의 네이티브 부분(iOS의 경우 Objective-C/Swift, Android의 경우 Java/Kotlin)이 먼저 로드됩니다.
- 네이티브 코드는 React Native 브릿지와 필요한 네이티브 모듈을 초기화합니다.
4. JavaScript 엔진 시작
- 네이티브 코드는 JavaScript 엔진(일반적으로 JavaScriptCore 또는 Hermes)을 시작합니다.
- 이 엔진은 React Native 앱의 JavaScript 코드를 실행할 환경을 제공합니다.
5. JavaScript 번들 로드
- 미리 컴파일된 JavaScript 번들(보통
index.bundle)이 로드됩니다. - 이 번들은 앱의 모든 JavaScript 코드와 필요한 React Native 라이브러리를 포함합니다.
6. React Native 초기화
- React Native 프레임워크가 초기화됩니다.
- 이 과정에서 React 렌더러, 컴포넌트 매니저, 모듈 레지스트리 등이 설정됩니다.
7. 앱 진입점 실행
- JavaScript 코드의 진입점(보통
index.js또는App.js)이 실행됩니다. - 이 시점에서 React 컴포넌트 트리의 초기 렌더링이 시작됩니다.
8. 브릿지 통신 시작
- React Native 브릿지를 통해 JavaScript와 네이티브 코드 간의 통신이 시작됩니다.
- 이를 통해 UI 업데이트, 네이티브 API 호출 등이 가능해집니다.
9. 초기 UI 렌더링
- React Native는 JavaScript에서 정의된 컴포넌트를 네이티브 UI 요소로 변환합니다.
- 이 과정은 Shadow 스레드에서 레이아웃 계산을 수행하고, 메인 UI 스레드에서 실제 렌더링을 합니다.
10. 네이티브 모듈 초기화
- 앱에서 사용하는 추가적인 네이티브 모듈(예: 카메라, 위치 서비스 등)이 초기화됩니다.
11. 데이터 로딩
- 필요한 경우, 앱은 로컬 저장소나 원격 서버로부터 초기 데이터를 로드합니다.
12. 스플래시 스크린 제거
- 초기화가 완료되면, 운영체제는 스플래시 스크린을 제거합니다.
13. 앱 표시
- 사용자에게 완전히 렌더링된 앱 UI가 표시됩니다.
14. 이벤트 루프 시작
- JavaScript 이벤트 루프가 시작되어 사용자 상호작용, 애니메이션, 네트워크 요청 등을 처리할 준비를 합니다.
이 전체 과정은 기기의 성능, 앱의 복잡성, 초기 데이터 로딩 요구사항 등에 따라 수백 밀리초에서 몇 초까지 걸릴 수 있습니다.