Modile Cross Platform Structure

OEM SDK

네이티브 코드를 사용하여 개발 하는 구조이다. 플렛폼별 최신 버전에 대한 대응을 빠르게 할 수 있고 타 플렛폼의 불필요한 코드가 존재하지 않는다. 하지만 플렛폼 별로 각각 개발을 하여야 한다.

 

 

Webview

android, iOS 모두 Webview 라는 웹브라우저를 사용하여 각 플렛폼별 코드를 관리할 필요가 없이 HTML 과 JavaScript로 두플렛폼 모두 관리할 수 있다. 하지만 Webview 지원되는 버전에 분기가 필요할수도 있고 플렛폼별 서비스와 통신하거나 하드웨어에 연결된 부분을 컨트롤 하기위해서는 각 플렛폼별 Bridge 라는 부분을 만들어서 별도로 관리해야 한다.

 

 

Reacte Native

ReactJS 프레임워크를 이용해서 개발하는 방식으로 JavaScript 를 통해서 

OEM widget 사용하여 그리기 때문에 네이트브로 개발하는것과 동일한 Widget 을 사용할 수 있다.

다만 모든 이벤트가 Bridge 을 통해서 하기때문에 병목현상이 발생할 수 있다.

 

 

Flutter

Flutter 프레임워크를 사용하는 개발하는 방식으로 화면을 랜더링 하는 부분과 플렛폼과 통신하는 체널이 저체적으로 분리되어있어 빠른 랜더링을 보여준다. 내부에 자체적으로 랜더링 을 하끼때문에 OEM Widget 을 사용하지 않기때문에 모든 플렛폼과 단말에서 동일한 UI 을 보여 줄 수 있다. 

 

 

Kotlin Multiplatform Mobile

OEM 개발과 동일한 방식이지만 Kotlin Shared code 부분을 양쪽플렛폼 모두 사용할수 있는 공통적인 비지니스 로직을 작성하여 중복적인 개발 줄어든다. 기존 네이티브 코드를 그대로 사용할수 있고 통합과정을 처음부터 새롭게 만드는 것이 아닌 부분적으로 반영할 수 있어 변경에 대한 부담이 적다. 그리고 기존에 네이티브 개발에 대한 부분이 동일하기 때문에 러닝커브가 낮은편이다. 다만 UI에 대한 부분은 OEM 과 동일하기 때문에 결국 각각 플렛폼으로 작성을 해야 한다. 현재 Compose를 사용하여 UI 부분도 공통으로 처리하도록 발전중이다. 작성일 기준으로 아직 Beta 버전이다.

 

 

[참고링크]

https://dev-repository.tistory.com/108

Flutter 개념, 구조 및 장점

 

https://skuld2000.tistory.com/69

[Flutter 강좌 1] Flutter 란? Flutter 의 특징에 대해..

 

https://medium.com/@dan_kim/%EB%B2%88%EC%97%AD-flutter%EB%8A%94-%EC%99%9C-%ED%98%81%EB%AA%85%EC%A0%81%EC%9D%B8%EA%B0%80-967c1dfcc5a9

[번역] Flutter는 왜 혁명적인가?

 

https://medium.com/flutter-community/in-plain-english-so-what-the-heck-is-flutter-and-why-is-it-a-big-deal-7a6dc926b34a

In plain English: So what the heck is Flutter and why is it a big deal?

 

https://reactnative.dev/

React Native · Learn once, write anywhere

 

https://medium.com/mindful-engineering/fabric-architecture-react-native-a4f5fd96b6d2

Fabric Architecture-React Native

 

https://www.jetbrains.com/lp/compose-mpp/

Compose Multiplatform Framework

 

https://github.com/JetBrains/compose-jb

GitHub - JetBrains/compose-jb: Compose Multiplatform, a modern UI framework for Kotlin that makes building performant and beauti

 

https://blog.jetbrains.com/ko/kotlin/2022/01/compose-multiplatform-1-0-is-going-live/

Compose Multiplatform 1.0 출시! | The Kotlin Blog

 

https://velog.io/@ams770/Android%EC%99%80-iOS%EC%97%90%EC%84%9C-Jetbrains-Compose-Skiko-%EC%A0%81%EC%9A%A9-Decompose-%EC%82%AC%EC%9A%A9

Android와 iOS에서 Jetbrains Compose를 사용하여 UI 코드 공유하기

 

https://proandroiddev.com/kotlin-multiplatform-a-panacea-for-mobile-app-development-c41ffe850d1b

Kotlin Multiplatform — A panacea for mobile app development?

 

https://medium.com/nerd-for-tech/kmm-ui-architecture-part-1-6362e14ee52a

KMM UI Architecture - Part 1