TL;DR

• 기존 서비스의 리텐션을 올리고
• 새로운 기술 쇼핑을 해보고자
• 플러터를 사용해서 웹뷰 앱을 만들게 되었음

Webview

• 네이티브 또는 크로스 플랫폼 앱 위에서 동작하는 하나의 브라우저

• 장점으로는

  • 빠른 앱 제작
    • 웹으로 개발된 페이지를 빠르게 앱으로 빌드할 수 있음
  • 번거로운 앱스토어 업데이트 불필요
    • 웹만 업데이트되면 웹뷰 상에서 바로 반영되므로 앱스토어에 별도로 업데이트를 해주지 않아도 됨
    • 근데 사실 앱에서는 Code Push (opens in a new tab)를 사용하면 바로 반영됨 🧑‍🦲

      Code Push: 심사과정 없이 앱을 업데이트할 수 있게 해주는 기술

• 단점으로는

  • 느린 속도
    • 웹 페이지를 불러오기 때문에 느림
  • 각종 OS / 버전 이슈
    • ex. 호환성 이슈 / UI가 각자 다르게 보이는 이슈
  • 배포 이슈
    • 웹뷰로만 구성된 앱은 스토어 심사가 통과가 잘 안된다는 얘기도 있음

만들어둔 웹을 빠르게 앱으로 빌드할 수 있는 장점 외에는 단점이 더 많은듯

실제로 한국 외의 앱 시장에서는 네이티브 위주로 앱 개발을 하는 듯한 경향이 있어보임

하지만 바쁘다 바빠 한국에서는 웹뷰를 적극적으로 사용하고 있는 곳이 많아 보임

어떤 도구를 사용할까?

native

• 각 운영체제에 맞는 개발 및 운영이 필요
  • Android: 안드로이드 스튜디오에서 Kotlin 사용
  • iOS: XCode에서 Swift 사용
• 사실상 두개의 앱을 만드는 것과 동일

cross-platform app

• 하나의 코드로 안드로이드, iOS에서 똑같이 동작하는 앱
• 즉, 동시에 개발 및 운영이 가능

cross-platform

React Native

• 자바스크립트 / 리액트 기반
• 메트로라는 js 번들러를 사용
• 런타임 중에 js 브릿지를 생성
  • js 코드를 네이티브 코드로 컴파일
  • 브릿지를 통해 네이티브 ui에 접근
• object-c api로 iOS 컴포넌트 렌더링
• 자바 api로 안드로이드 컴포넌트 렌더링

Flutter

• iOS / Android 뿐만 아니라 데스크탑, 웹 브라우저도 지원
• Dart 기반
• 별도의 브릿지 필요 x

  브릿지가 없는데 어떻게 네이티브로 변환이 될까?

  • Dart는 앱이 빌드되기 전에 코드를 미리 컴파일하는 AOT(Ahead-of-Time) 전략을 지원
  • 컴파일 타임에 Dart 코드를 -> 네이티브 코드로 컴파일

  따라서, 브릿지 없이 각 플랫폼과 직접 통신 -> 빠름

• 자체적인 위젯을 캔버스 위에 직접 렌더링하기 때문에 동일한 ui를 제공

2023 크로스 플랫폼 트렌드

• RN이 먼저 릴리즈돼서 초반에는 인기가 더 많았지만
• 2023년 기준 Stack Overflow 설문조사에 따르면 Flutter가 더 앞서나가는 중
• 나는 힙쟁이니까 플러터로 개발할거다

• 참고하면 좋은 자료 🤟
  • 라인에서 배달 앱을 RN을 Flutter로 전환한 내용 (opens in a new tab)