프론트엔드
다시 쓰는 해외 여행 이야기 — 웹뷰에서 네이티브로
두줄요약
해외 숙소 서비스의 웹뷰 화면을 Jetpack Compose 기반 네이티브로 전환했습니다.\n클린 아키텍처와 DB 분리, 성능 측정을 통해 로딩 속도와 유지보수를 개선했습니다.
문제 상황
- 해외 숙소 서비스의 웹뷰 기반 화면에서 렌더링 지연과 빈 화면 노출 문제가 발생
- 웹과 네이티브 코드 간 의사소통 복잡성으로 유지보수와 기능 추가가 어려움
- 공통 DB와 단일 모듈 구조로 인해 관심사 분리와 재빌드 효율이 낮음
해결 방법
- Jetpack Compose 기반 네이티브 전환으로 UI/UX와 로딩 속도 개선
- 클린 아키텍처로 Domain, Data, Presentation과 관심사별 모듈 재설계
- 별도 DB로 분리하고 StartUp 기반 Migration 로직을 일반화하여 데이터 안전 이전
성능/운영 포인트
- Firebase Performance Monitoring으로 웹뷰와 네이티브의 로드 시간 비교
- 웹뷰 약 2.61초 대비 네이티브 약 0.26초로 약 10배 개선 확인
- 정책과 API 응답 규격 정리를 위해 QA 문서와 서버 담당자 협업 필요