Yellosis | Cross-Platform App Developer | 2025-08 - 2025-08
Cym702: For Pets
#앱개발#마이그레이션#Flutter#React-Native#성능최적화
React-Native → Flutter 프레임워크 변경과 동시 성능 향상 애플리케이션
기술 스택
Vue2JavaScriptVueXSCSSApexChartReact-NativeTypeScriptFlutterOpenCV
주요 기능
- React-Native → Flutter 완전 마이그레이션
- 웹뷰 국가별 도메인 분리
- 번역 서비스 연동 (Indexed DB 활용)
- DoS 공격 방지 (디바이스 고유값 기반)
- OpenCV 이미지 처리 연동
상세 내용
React-Native → Flutter 프레임워크로 변경과 동시에 성능을 향상시킨 애플리케이션입니다.
구현 내용
- React-Native → Flutter 마이그레이션: open-cv, oauth, 웹뷰 통신 bridge protocol 등 작업
- 웹뷰 국가별 분리: 일본 전용 웹뷰, 한국 전용 웹뷰 등 국가별 도메인 생성
- 번역 사이트 개발: 번역본 변경 시 실시간으로 앱 내 글 변경
- API 보안 강화: 봇(Bot)을 이용한 무차별적인 SMS 인증 API 공격 방어
성과
-
기술적 의사결정 및 성능 최적화 (React-Native → Flutter)
- 앱 시작 속도 60% 단축 및 초기 카메라 로딩 속도 50% 개선
- CPU 점유율 95% 감소 및 배터리 소모량 67% 절감
- APK 설치 크기 65% 축소
- 장시간 사용 시 발생하던 발열 및 프레임 드랍 문제 해결
-
웹뷰 국가별 도메인 생성
- 언어 길이에 따른 UI/UX 문제 해결
- 각 나라별 출시 기능 제공
-
번역 서비스 연동
- i18n 라이브러리 대신 서버 database에 번역본 저장
- Indexed DB를 이용하여 번역본 캐싱 및 실시간 반영
배운 점
- React-Native에서 Flutter로 마이그레이션으로 성능 60% 개선
- CPU 점유율 95% 감소 및 배터리 소모량 67% 절감
- APK 용량 65% 축소
- 번역 서비스를 서버 기반으로 변경하여 유지보수성 향상