[React Native] Bridge ( 브릿지 )

* React Native가 JavaScript와 네이티브 코드 (iOS의 Objective-C/Swift, Android의 Java/Kotlin) 간의 소통을 가능하게 하는 핵심 메커니즘

1. Bridge의 역할:
   • React Native는 JavaScript로 작성된 코드와 네이티브 모듈 간의 소통을 Bridge라는 중간 다리 역할을 통해 가능하게 해.
   • JavaScript 코드와 네이티브 코드가 서로 직접 소통하지 않고, Bridge를 통해 서로 데이터를 주고받아. 이로 인해, iOS와 Android 환경에서 동일한 코드로 네이티브 기능을 사용할 수 있게 돼.
2. Bridge의 비동기 통신:
   • Bridge는 JavaScript와 네이티브 코드 간의 통신을 비동기적으로 수행해. 이는 JavaScript의 싱글 스레드가 UI 업데이트와 네이티브 기능을 동시에 실행할 수 있게 하여 성능 저하를 방지해.
   • 예를 들어, JavaScript에서 네이티브 모듈을 호출하면, 이 요청이 Queue에 들어가서 차례대로 처리돼. 이렇게 비동기로 데이터를 주고받는 구조는 앱의 유연성을 높여줘.
3. Bridge의 활용 예:
   • React Native는 카메라, GPS, 센서 등 네이티브 기능을 JavaScript로 쉽게 호출할 수 있게 해. 예를 들어, JavaScript 코드에서 카메라 모듈을 호출하면 Bridge가 이를 네이티브 카메라 API와 연결해줘.
   • 개발자는 이처럼 네이티브 모듈을 브릿지 방식으로 작성해서 JavaScript에서 호출 가능하게 만들 수 있어, 이를 통해 필요한 네이티브 기능을 직접 구현할 수 있지.
4. 새로운 아키텍처 (JSI):
   • React Native는 성능 향상을 위해 Bridge 구조에서 발전된 새로운 아키텍처, 즉 **JavaScript Interface (JSI)**로 옮겨가고 있어. JSI는 더 빠르고 효율적인 방식으로 네이티브 코드와 소통하도록 개선된 구조야.

이 Bridge 개념 덕분에 JavaScript 코드로 네이티브의 다양한 기능을 활용할 수 있으며, 이는 React Native가 네이티브에 가까운 성능을 제공할 수 있는 이유 중 하나야.

 

 

 

• Bridge: JavaScript와 네이티브 코드(iOS/Android) 간의 소통을 가능하게 하는 중간 다리 역할
• 비동기 통신: JavaScript와 네이티브 모듈 간 통신을 비동기로 처리하여 성능 최적화
• 네이티브 기능 호출: JavaScript에서 카메라, GPS 등 네이티브 기능을 쉽게 호출 가능
• JSI: 성능을 향상시킨 JavaScript Interface로 점진적 전환