React Native New Architecture 라이브러리 제작
크로스플랫폼 코리아 6월 밋업 영상입니다. 이번 주제는 "React Native New Architecture 라이브러리 제작"입니다.
크로스플랫폼 코리아 6월 밋업 영상입니다. 이번 주제는 "React Native New Architecture 라이브러리 제작"입니다.
Expo로 네이티브 모듈을 만들어보는 영상입니다. 기존에 네이티브 모듈을 만드는 것과 확실히 더 장점이 많이 보입니다.
Expo SDK 51 업데 이트 내용 브리핑입니다.
리액트네이티브 0.74 업데이트 내용 브리핑입니다.
리액트네이티브 개발자분들에게 좋은 소식입니다. Software Mansion에서 아주 혁신적인 React Native 용 IDE를 출시했습니다 🎉
Hermes는 Facebook에서 개발한 오픈 소스 JavaScript 엔진으로, 특히 React Native 앱의 시작 시간을 개선하기 위해 설계되었습니다. 2019년 React Native 0.60.4에서 처음 도입되었습니다.
리액트 네이티브 앱은 대게 JavaScript를 사용하여 작성되며, 이 코드는 장치에서 실행되기 전에 JavaScript 엔진을 통해 해석됩니다. 이전에는 대부분의 리액트 네이티브 앱들이 JSC (JavaScriptCore)를 사용하여 코드를 해석했습니다. 하지만 Facebook은 특히 모바일 앱에서의 성능 향상을 목표로 Hermes를 도입했습니다.
Hermes의 주요 특징과 장점은 다음과 같습니다:
더 알아보고 싶으시면 Hermes 엔진이란? 블로그를 확인해보세요.
React Native Architecture
는 React Native 애플리케이션의 내부 구조와 동작 원리를 설명하는 용어입니다. React Native의 초기 아키텍처는 몇 가지 주요 구성 요소로 구성되었으며, 시간이 지나면서 개선과 업데이트가 이루어져 애플리케이션의 성능과 안정성을 향상시켰습니다. 2021년까지의 정보를 기반으로 설명하겠습니다.
Bridge: React Native의 초기 아키텍처의 핵심 요소였습니다. Bridge는 JavaScript 스레드와 Native 스레드 간의 통신을 가능하게 했습니다. JavaScript에서 생성된 UI 업데이트, 이벤트 등을 Native 코드로 전송하는 역할을 합니다.
JavaScript Core (JSC): iOS에서 사용되는 JavaScript 엔진입니다. Android에서는 JSC를 포함하여 번들에 포함시켜 배포합니다.
Native Modules: React Native 애플리케이션에서 기기의 Native 기능에 접근할 수 있게 해주는 모듈입니다. 예를 들면, 카메라, GPS, 파일 시스템에 접근할 수 있습니다.
그러나 Facebook은 React Native의 성능과 유연성을 향상시키기 위해 아키텍처를 계속 개선하고 있습니다. "Fabric" 및 "TurboModules"와 같은 새로운 아키텍처 업데이트가 도입되었습니다.
Fabric: React Native의 UI 레이어를 재작성하는 프로젝트입니다. 이를 통해 더 빠른 UI 업데이트와 더 부드러운 애니메이션을 달성할 수 있습니다. Fabric은 JavaScript와 Native 간의 통신을 최소화하여 성능을 향상시킵니다.
TurboModules: Native Modules의 재작성 버전으로, JavaScript 스레드와 Native 스레드 간의 통신 성능을 향상시킵니다.
새로운 아키텍처의 도입은 React Native 애플리케이션의 성능을 향상시키며, Native와의 통합을 더욱 원활하게 만들기 위한 것입니다.
리엑트 네이티브 새로운 아키텍쳐에 대해서 더 자세히 알아보세요.