Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
KMPを使ってみて感じた良いところ・ツラいところ
Search
Ryu-nakayama
October 05, 2023
Programming
0
1.8k
KMPを使ってみて感じた良いところ・ツラいところ
stmn#2の登壇資料です
Ryu-nakayama
October 05, 2023
Tweet
Share
More Decks by Ryu-nakayama
See All by Ryu-nakayama
効率化に挑戦してみたらモバイル開発が少し快適になった話
ryunakayama
0
1.6k
新卒1年目がプロジェクトを進めるときにコケたポイント
ryunakayama
1
1.6k
期限が近づいてきた!Privacy Manifests対応
ryunakayama
5
9k
新卒iOSエンジニアとしてやってきたこと
ryunakayama
0
1.7k
今年学んだ便利ツール_便利技
ryunakayama
0
1.6k
git worktreeを使って複数ブランチを扱いやすくする
ryunakayama
0
2.3k
SwiftUIに適した新アーキテクチャの導入に挑む
ryunakayama
2
9.1k
Swiftでテスト時のみ『private』にアクセスする方法
ryunakayama
1
2.4k
Other Decks in Programming
See All in Programming
FoodGram
iseruuuuu
0
230
酒飲んでたらテックリードになった話
spbaya0141
0
210
RustでAWS Lambda functionをいい感じに書く
taiki45
2
150
Ruby on Fails - effective error handling with Rails conventions
talyssonoc
0
290
TSKaigi 2024 - 新サービス Progate Path の演習で TypeScript を採用して見えた教材観点からの利点と課題
makotoshimazu
1
220
WebGLで始める コンピュータグラフィックス入門
heller77
0
370
WinActorの勉強を継続する方法
tamai_63
0
130
CREってこういうこと? 体験入社 - 提案資料 - / what-is-cre-trial-employment
shinden
1
620
Namespace, What and Why
tagomoris
3
660
The grand strategy of Ruby Parser
yui_knk
4
260
TypeScript 関数型スタイルでバックエンド開発のリアル
naoya
49
16k
Escolhendo (ou não) o melhor ORM para o seu projeto
andreiacsilva
1
160
Featured
See All Featured
Imperfection Machines: The Place of Print at Facebook
scottboms
261
12k
For a Future-Friendly Web
brad_frost
172
9k
Web Components: a chance to create the future
zenorocha
306
41k
Robots, Beer and Maslow
schacon
PRO
155
8k
Clear Off the Table
cherdarchuk
86
310k
Creatively Recalculating Your Daily Design Routine
revolveconf
211
11k
What's in a price? How to price your products and services
michaelherold
238
11k
Learning to Love Humans: Emotional Interface Design
aarron
267
39k
A designer walks into a library…
pauljervisheath
201
23k
Optimizing for Happiness
mojombo
370
69k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
242
1.2M
Designing Experiences People Love
moore
136
23k
Transcript
Chatwork株式会社 モバイルアプリケーション開発部 中山 龍 2023年10月6日 KMPを使ってみて感じた 良いところ・ツラいところ
自己紹介 中山 龍 (なかやま りゅう) • Chatwork株式会社 ◦ iOSエンジニア ◦
2023年4月 新卒として入社 ◦ 社内最年少 (2002年6月生まれの21歳) • 愛知県在住 ◦ フルリモート勤務 ◦ 最近名古屋市内に引っ越しました 2 @ryu_develop
注意
このLTの趣旨 4 このLTは『普段iOSネイティブを触っているエンジニアがKMP を体験してみたよ』という話です KMPに関する深い知見を持っている立場ではないことにご注意ください
各モバイル開発手法の比較
①ネイティブ
①ネイティブ 7 iOS / Androidそれぞれに専用のプログラムを書いて実装する iOS Android
メリット ネイティブの特徴 8 デメリット • 標準のUIやOSの新機能を使える ◦ OSによって提供される最新機能も 使用可能 •
高いパフォーマンスが期待できる • 各OSでの開発が必要 ◦ iOS/Androidに合わせて2つ作成す ることが必要となる ◦ 各OSで開発者に必要な技術が統一 できない
②クロスプラットフォーム ※ ※ ここでは共通のソースコードのみで各 OSのアプリが ビルド可能になるものを指す
②クロスプラットフォーム 1つのプログラムでiOS / Androidそれぞれ動作するようにする 10 iOS / Android など
メリット クロスプラットフォームの特徴 11 デメリット • 1つのソースコードで各OSの開 発ができる ◦ ネイティブでの開発と比べて開発 コストが低く済む
• OSの機能や最新技術が利用できない場 合がある • 複雑な機能には各ネイティブのコード を書く必要がある場合がある • ネイティブに比べてパフォーマンスが 落ちる場合がある
12 ネイティブのように標準のUIやOSの最新機能を使いたいけ ど、クロスプラットフォームのように共通のコードで楽したい...
13 ネイティブのように標準のUIやOSの最新機能を使いたいけ ど、クロスプラットフォームのように共通のコードで楽したい... そこで、部分的に共通化するという選択肢
KMPを導入する
KMPって何?
KMPって何? KMP = Kotlin Multiplatform 16
KMPって何? KMP = Kotlin Multiplatform 17 Kotlinを使って、クロスプラットフォームプロジェクト の開発を簡素化する技術
KMPって何? 少し前だと... KMPを使って、モバイル開発に特化した機能や技術を実現した ものをKMMと呼んでいた ↓ 名称がKMPに統一された 18
KMPって何? 本LTでの『KMP』という表現は 従来の『KMM』のイメージ 19
部分的に共通化する
ネイティブの開発をしていると 21 ネイティブで各OSをそれぞれ開発していると... こう考えることもあるのではないでしょうか? • iOSもAndroidもドメイン知識は共通なのになぁ... • アプリ特有のこの処理、共通なのになぁ...
ネイティブの開発をしていると 22 ネイティブで各OSを開発していると... こう考えることもあるのではないでしょうか? • iOSもAndroidもドメイン知識は共通なのになぁ... • アプリ特有のこの処理、共通なのになぁ... でも •
OS標準のUIや新機能を使って実装したい部分もある...
ネイティブの開発をしていると 23 ネイティブで各OSを開発していると... こう考えることもあるのではないでしょうか? • iOSもAndroidもドメイン知識は共通なのになぁ... • アプリ特有のこの処理、共通なのになぁ... でも •
OS標準のUIや新機能を使って実装したい部分もある... 部分的に共通化するのに使えるのがKMP
KMP(共通部分) 部分的に共通化 共通化する部分はKMPで書き、 必要な部分はそれぞれのネイティブで書く 24 iOS Android
KMPを使うことで... 25 • ネイティブ開発と比べて労力を抑えられる ◦ それぞれのOSに合わせて作る部分を減らすことができる • OSの機能や標準のUIを呼び出すことが可能 ◦ 呼び出したい部分はネイティブで記述する
実際に使ってみた
実装してみる題材
実装してみる題材 • UIにはそれぞれ以下のもので実装する ◦ iOS: SwiftUI ◦ Android: Jetpack Compose
28 TODOアプリを作る • TODOを一覧表示でき、新規に追加ができる ◦ 入力欄に文字を入力し、追加ボタンを押す • TODOの達成・未達成を切り替えることができる ◦ 表示されているTODOの横のアイコンをタップすることで切り替えられる iOS / Androidどちらも実装する
共通化する部分 29 TODOのロジック プレゼンテーションロジック プレゼンテーションロジック UI(SwiftUI) UI(Jetpack Compose)
実装してみた
アプリ起動時 iOS 31 Android
iOS Android テキストフィールドに内容を入力 32
iOS Android 追加ボタンを押すとリストに追加される 33
iOS Android 同様に2件目も追加できる 34
iOS Android アイテム右のアイコンタップで 赤丸→チェック になる 35
サンプルコードのリポジトリ https://github.com/Ryu-nakay/todo-app-with-kmp 36
KMPを使ってみての感想
良いと思ったところ1 共通のロジックを書かなくて済む 38 KMP(Kotlin)を使って書くことで、Swiftで再度書き直す手間が省 けた 今回は、『TODOの表現や振る舞いを定義するコード』を共通化した • 1件のTODOを表す型 • 完了・未完了切り替えの処理
• 複数のTODOの集合を表す型 • TODO追加の処理 など
OS間も含めた『コードの重複』を減らし、高い変更容易性を実現 できる 良いと思ったところ2 39 共通化した部分は仕様の変更が楽 • TODOの表現を変える ◦ ex)『期限』を追加する •
TODOの振る舞いを変える ◦ ex) 『削除』を可能にする といった変更が今後あったとしても... KMP(Kotlin)で共通化したコードを変更するだけで変更を実現可能
ツラいところ1 40 iOS側では型が期待したものではない また、KotlinArrayの要素数すら、型はIntではなくInt32 KMP(Kotlin) Swift Int Int32 Array<T> KotlinArray<T>
一部を挙げると、以下の表のような型になってしまう SwiftからKMPを呼び出した際の型がなかなか不自由... この問題を解消するために何かしら手を打たないとツラい
ツラいところ2 41 Xcodeではサジェストが弱い・コード定義も見られない その型が持っているプロパティ・メソッドがサジェストされるかは割と気まぐれ → サジェストしてもらうというのは期待しない方がよい また、KMPの型やメソッドの実装を見たいと思っても、KotlinやSwiftのコードで見ることは できない😱 (KMPの実装をiOS側で使用する際に、 ObjCヘッダーファイルとして生成されてしまうため
) 実装を見ようとするとツラいものが見える
使ってみてのまとめ 『部分的に共通化する』という考え方はとても良いものだと思った → だが、KMPには良いところだけでなく、ツラいポイントも存在している 42 しっかりと知見を持って • KMPを導入することで得られるメリットが大きいかどうか • KMPを導入するのなら、どのようにツラいポイントと向き合うのか
を考える必要があると感じた。 『何も考えずKMPを導入すればハッピー』
働くをもっと楽しく、創造的に