기본 개념과 언어
|
Flutter |
React Native |
| 개발사 |
Google |
Meta (구 Facebook) |
| 언어 |
Dart |
JavaScript (또는 TypeScript) |
| UI 렌더링 방식 |
자체 UI 엔진 (Skia) |
네이티브 컴포넌트 사용 + 브릿지 |
- Flutter는 Google이 만든 Dart 언어를 사용하고, 자체 렌더링 엔진을 활용해 UI를 직접 그려.
- React Native는 JavaScript (또는 TypeScript) 기반이고, 네이티브 컴포넌트를 활용하는 방식이야.
Dart의 장점
- Null Safety 지원 → NPE(NullPointerException) 방지
- Ahead-of-Time (AOT) 컴파일 지원 → 더 빠른 실행 속도
- React Native보다 디버깅이 쉬움
UI 구성 방식
|
Flutter |
React Native |
| UI 컴포넌트 |
자체 UI 위젯 사용 (Material, Cupertino) |
네이티브 컴포넌트 활용 |
| 커스텀 디자인 |
기본적으로 일관된 UI 가능 |
플랫폼에 따라 UI 차이 발생 가능 |
- Flutter는 모든 UI를 위젯 기반으로 직접 렌더링해서, iOS와 Android에서 완전히 동일한 UI를 보여줘.
- React Native는 OS의 네이티브 UI 컴포넌트를 활용해서, 플랫폼마다 UI가 조금씩 다를 수 있어.
👉 Flutter는 "완벽한 일관성"을, React Native는 "네이티브 느낌"을 더 살림
성능 비교
|
Flutter |
React Native |
| 속도 |
빠름 (자체 렌더링 엔진) |
브릿지 사용으로 상대적으로 느릴 수 있음 |
| 애니메이션 |
고성능 (60~120fps 가능) |
기본적으로 60fps, 브릿지로 인해 지연 가능 |
| 네이티브 성능 접근 |
직접 C++ 엔진 활용 |
네이티브 모듈 연결 필요 |
- Flutter는 네이티브 성능에 가까운 속도를 제공해. (자체 엔진 덕분!)
- React Native는 JavaScript와 네이티브 간 브릿지 통신이 필요해서, 성능이 살짝 떨어질 수 있어.
👉 Flutter가 더 빠르고 부드러운 UI/애니메이션을 제공함