KMPを使ってみて感じた良いところ・ツラいところ

stmn#2の登壇資料です

Transcript

1. Chatwork株式会社 モバイルアプリケーション開発部 中山 龍 2023年10月6日 KMPを使ってみて感じた 良いところ・ツラいところ
2. 自己紹介 中山 龍 (なかやま りゅう) • Chatwork株式会社 ◦ iOSエンジニア ◦ 2023年4月 新卒として入社 ◦ 社内最年少 (2002年6月生まれの21歳) • 愛知県在住 ◦ フルリモート勤務 ◦ 最近名古屋市内に引っ越しました 2 @ryu_develop
3. 注意
4. このLTの趣旨 4 このLTは『普段iOSネイティブを触っているエンジニアがKMP を体験してみたよ』という話です KMPに関する深い知見を持っている立場ではないことにご注意ください
5. 各モバイル開発手法の比較
6. ①ネイティブ
7. ①ネイティブ 7 iOS / Androidそれぞれに専用のプログラムを書いて実装する iOS Android
8. メリット ネイティブの特徴 8 デメリット • 標準のUIやOSの新機能を使える ◦ OSによって提供される最新機能も 使用可能 • 高いパフォーマンスが期待できる • 各OSでの開発が必要 ◦ iOS/Androidに合わせて2つ作成す ることが必要となる ◦ 各OSで開発者に必要な技術が統一 できない
9. ②クロスプラットフォーム ※ ※ ここでは共通のソースコードのみで各 OSのアプリが ビルド可能になるものを指す
10. ②クロスプラットフォーム 1つのプログラムでiOS / Androidそれぞれ動作するようにする 10 iOS / Android など
11. メリット クロスプラットフォームの特徴 11 デメリット • １つのソースコードで各OSの開 発ができる ◦ ネイティブでの開発と比べて開発 コストが低く済む • OSの機能や最新技術が利用できない場 合がある • 複雑な機能には各ネイティブのコード を書く必要がある場合がある • ネイティブに比べてパフォーマンスが 落ちる場合がある
12. 12 ネイティブのように標準のUIやOSの最新機能を使いたいけ ど、クロスプラットフォームのように共通のコードで楽したい...
13. 13 ネイティブのように標準のUIやOSの最新機能を使いたいけ ど、クロスプラットフォームのように共通のコードで楽したい... そこで、部分的に共通化するという選択肢
14. KMPを導入する
15. KMPって何？
16. KMPって何？ KMP = Kotlin Multiplatform 16
17. KMPって何？ KMP = Kotlin Multiplatform 17 Kotlinを使って、クロスプラットフォームプロジェクト の開発を簡素化する技術
18. KMPって何？ 少し前だと... KMPを使って、モバイル開発に特化した機能や技術を実現した ものをKMMと呼んでいた ↓ 名称がKMPに統一された 18
19. KMPって何？ 本LTでの『KMP』という表現は 従来の『KMM』のイメージ 19
20. 部分的に共通化する
21. ネイティブの開発をしていると 21 ネイティブで各OSをそれぞれ開発していると... こう考えることもあるのではないでしょうか？ • iOSもAndroidもドメイン知識は共通なのになぁ... • アプリ特有のこの処理、共通なのになぁ...
22. ネイティブの開発をしていると 22 ネイティブで各OSを開発していると... こう考えることもあるのではないでしょうか？ • iOSもAndroidもドメイン知識は共通なのになぁ... • アプリ特有のこの処理、共通なのになぁ... でも • OS標準のUIや新機能を使って実装したい部分もある...
23. ネイティブの開発をしていると 23 ネイティブで各OSを開発していると... こう考えることもあるのではないでしょうか？ • iOSもAndroidもドメイン知識は共通なのになぁ... • アプリ特有のこの処理、共通なのになぁ... でも • OS標準のUIや新機能を使って実装したい部分もある... 部分的に共通化するのに使えるのがKMP
24. KMP(共通部分) 部分的に共通化 共通化する部分はKMPで書き、 必要な部分はそれぞれのネイティブで書く 24 iOS Android
25. KMPを使うことで... 25 • ネイティブ開発と比べて労力を抑えられる ◦ それぞれのOSに合わせて作る部分を減らすことができる • OSの機能や標準のUIを呼び出すことが可能 ◦ 呼び出したい部分はネイティブで記述する
26. 実際に使ってみた
27. 実装してみる題材
28. 実装してみる題材 • UIにはそれぞれ以下のもので実装する ◦ iOS: SwiftUI ◦ Android: Jetpack Compose 28 TODOアプリを作る • TODOを一覧表示でき、新規に追加ができる ◦ 入力欄に文字を入力し、追加ボタンを押す • TODOの達成・未達成を切り替えることができる ◦ 表示されているTODOの横のアイコンをタップすることで切り替えられる iOS / Androidどちらも実装する
29. 共通化する部分 29 TODOのロジック プレゼンテーションロジック プレゼンテーションロジック UI(SwiftUI) UI(Jetpack Compose)
30. 実装してみた
31. アプリ起動時 iOS 31 Android
32. iOS Android テキストフィールドに内容を入力 32
33. iOS Android 追加ボタンを押すとリストに追加される 33
34. iOS Android 同様に2件目も追加できる 34
35. iOS Android アイテム右のアイコンタップで 赤丸→チェック になる 35
36. サンプルコードのリポジトリ https://github.com/Ryu-nakay/todo-app-with-kmp 36
37. KMPを使ってみての感想
38. 󰢏良いと思ったところ1 共通のロジックを書かなくて済む 38 KMP(Kotlin)を使って書くことで、Swiftで再度書き直す手間が省 けた 今回は、『TODOの表現や振る舞いを定義するコード』を共通化した • 1件のTODOを表す型 • 完了・未完了切り替えの処理 • 複数のTODOの集合を表す型 • TODO追加の処理 など
39. OS間も含めた『コードの重複』を減らし、高い変更容易性を実現 できる 󰢏良いと思ったところ2 39 共通化した部分は仕様の変更が楽 • TODOの表現を変える ◦ ex)『期限』を追加する • TODOの振る舞いを変える ◦ ex) 『削除』を可能にする といった変更が今後あったとしても... KMP(Kotlin)で共通化したコードを変更するだけで変更を実現可能
40. 󰢃ツラいところ1 40 iOS側では型が期待したものではない また、KotlinArrayの要素数すら、型はIntではなくInt32 KMP(Kotlin) Swift Int Int32 Array<T> KotlinArray<T> 一部を挙げると、以下の表のような型になってしまう SwiftからKMPを呼び出した際の型がなかなか不自由... この問題を解消するために何かしら手を打たないとツラい
41. 󰢃ツラいところ2 41 Xcodeではサジェストが弱い・コード定義も見られない その型が持っているプロパティ・メソッドがサジェストされるかは割と気まぐれ → サジェストしてもらうというのは期待しない方がよい また、KMPの型やメソッドの実装を見たいと思っても、KotlinやSwiftのコードで見ることは できない😱 　(KMPの実装をiOS側で使用する際に、 ObjCヘッダーファイルとして生成されてしまうため ) 実装を見ようとするとツラいものが見える
42. 使ってみてのまとめ 『部分的に共通化する』という考え方はとても良いものだと思った → だが、KMPには良いところだけでなく、ツラいポイントも存在している 42 しっかりと知見を持って • KMPを導入することで得られるメリットが大きいかどうか • KMPを導入するのなら、どのようにツラいポイントと向き合うのか を考える必要があると感じた。 󰢃『何も考えずKMPを導入すればハッピー』
43. 働くをもっと楽しく、創造的に