いいね問題に対する技術選定事例

406 Views

December 20, 24

スライド概要

Ebisu.mobile #8 大忘年会 STORES kubell Kyash asken で発表したスライドです。
https://hey.connpass.com/event/335971/

profile-image

Android Engineer at Kyash Inc.

シェア

またはPlayer版

埋め込む »CMSなどでJSが使えない場合

関連スライド

各ページのテキスト
1.

いいね問題に対する技術選定事例 Ebisu.mobile #8 大忘年会 STORES kubell Kyash asken ©2024 Kyash Inc. ©2024 Kyash Inc.

2.

自己紹介 自己紹介 ● 高田 晴彦 ● @tfandkusu ○ Qiita/Zenn/note/GitHub/X ● 株式会社Kyash ● Androidエンジニア ● スプラトゥーンが好き ©2024 Kyash Inc. 2

3.

概要 アウトライン ● 「いいね問題」の解説 ● これまで経験したプロジェクトでの解決方法を3つ紹介 ○ 個人的感想 ○ チーム内でのディスカッションの様子を紹介 ©2024 Kyash Inc. 3

4.

概要 聴講対象者や用語について ● 発表者は Android エンジニアなので Android の話が中心 ● iOS / Android 両方を対象としたモバイルのイベントなので、iOS にも少し触れる ● Android 固有の用語は iOS エンジニアもイメージしやすいように、適時言い換え ©2024 Kyash Inc. 4

5.

「いいね問題」の解説 ©2024 Kyash Inc. 5

6.

いいね問題の解説 例えば X アプリで 投稿一覧画面 から 投稿詳細画面 を開いて ©2024 Kyash Inc. 投稿一覧画面 に戻ったら いいねを付けて 当然にいいね が付いていな いといけない 6

7.

いいね問題の解説 「いいね問題」という名称は俗称かもしれない 補足ページで解説 ©2024 Kyash Inc. 7

8.

これまで経験した プロジェクトでの 解決方法3つ ©2024 Kyash Inc. 8

9.

解決方法 2010年〜2018年 最初の会社 一覧画面から詳細画面 が開かれて いいねを付けて 画面が閉じられた 更新してねを一覧画面 に伝える スクリーンショットはサンプルの GitHub リポジトリ一覧アプリ ©2024 Kyash Inc. 9

10.

解決方法 画面が閉じられた時に、呼び出し元画面に情報を伝える方法 ● 当時は onActivityResult を使っていた ● 現代で同じことをする場合 ● ○ Activity Result API ○ Fragment Result API iOS ではクロージャー(コールバック)が使われるが、閉じるときに以外も呼び出すことができる ©2024 Kyash Inc. 10

11.

解決方法 個人的評価 当時は私1人で担当していた程度に、アプリの規模が小規模だったので、これでなんとかなっていた。 ©2024 Kyash Inc. 11

12.

解決方法 2019年 〜 2022年 2社目 株式会社リサーチ・アンド・イノベーション ● 買った商品のレビューを投稿 レシートがお金に変わる「CODE」 ● 他ユーザのレビューにいいねを付ける 画像は CODE の Google Play ページより引用 ©2024 Kyash Inc. 12

13.

解決方法 いいね問題がややこしい画面群 商品レビューを 見るページ 自分のレビュー を投稿 ● ● ©2024 Kyash Inc. 平均評価 件数 他ユーザのレビュー にいいねを付ける 13

14.

解決方法 いいね問題がややこしい画面群 商品ランキング ©2024 Kyash Inc. 自分のレビュー を投稿 別の 商品ページの ランキング 他ユーザの レビューにい いねを付け る 同じ商品 14

15.

解決方法 いいね問題がややこしい画面群 別の画面で投稿した 自分のレビューを表示 平均評点と件数には 別の画面で投稿した 分も反映されていな いといけない 別の画面で付けた「いい ね」も反映 これらを画面間の連絡で 実現することは難しい ©2024 Kyash Inc. 15

16.

解決方法 いいね問題がややこしい画面群 ● レビューとランキングは ページング対応 ● 20件×5ページ ©2024 Kyash Inc. 16

17.

解決方法 SQLite を活用 ● 商品レビューの画面群に表示する内容は API から取ってきて、すぐに SQLite に 保存 ● 画面表示は SQLite の内容と同期するよ うに作成 ● Room という OR マッパーを使用 ● Flow を使って更新監視 取得 API ©2024 Kyash Inc. 保存 更新監視 (Flow) SQLite (Room) 17

18.

解決方法 ユーザが投稿したとき すべての画面に 変更が反映 投稿 API ©2024 Kyash Inc. 必要に応じて 最新情報を取得 変更差分を 保存 更新監視 (Flow) SQLite (Room) 18

19.

解決方法 ストレージに保存する理由 メモリに持っておけば良いのでは🤔 取得 API ©2024 Kyash Inc. 設定 更新監視 メモリ上の値 (MutableStateFlow) 19

20.

解決方法 ストレージに保存する理由 Android 特有のプロセスキルからの復帰挙動の対応 ここでバックグラウンドに移行し 別アプリを使用。 メモリが足りなくなって OS にプロセスキルされた。 最初の 画面 次回起動時は ここから開始 iOS では State Restoration を実装することで同様の挙動にできる ©2024 Kyash Inc. 20

21.

解決方法 ストレージに保存する理由 ページングを使用している画面 プロセスキル 5ページ目 5ページ目 復帰 ©2024 Kyash Inc. 21

22.

解決方法 個人的評価 ● 別画面で行われた更新を抜けなく反映できる ● 画面状態の作成は SQL のクエリ結果と同期するだけで簡単 ● テーブル設計や SQL 作成など SQLite を取り扱う分の工数は増える ● アプリの仕様変更でマイグレーションが必要になるが、Room には2021年12月からオートマイグ レーションが追加されたため、それ以降、そこはそんなに手間を感じなかった。 ©2024 Kyash Inc. 22

23.

解決方法 2023年 〜 現在 3社目 デジタルウォレットアプリ「Kyash」 Android だけ Kotlin Multiplatform 2〜3人 iOS / Android エンジニア 6〜8人 ©2024 Kyash Inc. 23

24.

解決方法 Kyash のいいね問題 家計簿 ©2024 Kyash Inc. 支出一覧 支出詳細 カテゴリ変更 24

25.

解決方法 カテゴリ変更の実装方法 支出一覧 支出詳細 再読込を伝える ©2024 Kyash Inc. カテゴリ変更 変更先カテゴリ を伝える 25

26.

解決方法 ディスカッション 家計簿タブ ウォレットタブ 想定されていた要件 家計簿の 集計結果 ©2024 Kyash Inc. 26

27.

解決方法 ディスカッション 取得 更新監視 格納 API メモリ or SQLite ? ©2024 Kyash Inc. 27

28.

解決方法 採用 メモリ SQLite ● 導入コストが低い ● プロセスキルでデータが消えない ● データ形式の変更対応が容易 ● データの取得に SQL が使える × プロセスキルでデータが消える × 導入コストが高い × マイグレーションを意識 再度 API から取得 × ライブラリの学習コスト 想定している要件に 対してオーバー iOS エンジニアは Kotlin の SQLite ライブラリに馴染みが無い ©2024 Kyash Inc. 28

29.

まとめ ©2024 Kyash Inc. 29

30.

まとめ 最終的に伝えたいこと ● いいね問題への対応方針は要件やチーム体制によって異なる ● 異動や転職などでプロジェクトが変わったときは、いいね問題の対応方針を確認する ● それが決まっていなければ、ディスカッションを始めてチームで統一されたガイドラインを作成する ©2024 Kyash Inc. 30

31.

まとめ エンジニア募集中 ● 例えば、技術選定をディスカッションしたい iOS / Android エンジニアを募集中 ● いいね問題については、現在はメモリ上の値を更新監視する方針だが、今後の要件やチーム内の 機運によっては、SQLite を更新監視する可能性もある。Kotlin Multiplatform での開発基盤 構築や開発ガイドライン整備を主導したい人も大歓迎。 ©2024 Kyash Inc. 31

32.

ありがとうございました ©2024 Kyash Inc. 32

33.

補足 ©2024 Kyash Inc. 33

34.

補足 エンジニア募集関連リンク ● Kyash Advent Calendar 2024 ● 求人一覧 ©2024 Kyash Inc. 34

35.

補足 いいね問題の名称は一般的な名称でなく俗称かもしれない いいね問題、いいねボタン問題という名称で同様の課題を紹介している記事はいくつかある 「いいね問題 Android」で Google 検索して見つけた記事を掲載 ● Source of truthを確保するためにRoom databaseを使うメモ(いいね問題) ● kotlin coroutines flowでいいねボタン問題を解決しよう ● iOS/Androidアプリにおける状態管理の複雑さにリポジトリパターンを拡張して立ち向かう (1/3 考え方編) ○ ©2024 Kyash Inc. 文中に「ケース2: "いわゆる"いいねボタン問題」という記載あり 35

36.

補足 ChatGPT に聞いてみた ● ● スラングのようなもの より一般的な名称 ○ 状態の同期問題 ○ キャッシュの整合性問題 ©2024 Kyash Inc. 36