月間4.5億回再生を超える大規模サービス TVer iOSアプリのリアーキテクチャ戦略 - iOSDC2024

iOSDC2024
https://fortee.jp/iosdc-japan-2024/proposal/00223e3b-6ba6-4dcc-8f78-7b8b27841ab5

Transcript

1. ©2024 TVer INC. 　 　 月間4.5億回再生を超える大規模サービス TVer iOSアプリのリアーキテクチャ戦略 2024.08.23 小森英明 @hide 株式会社TVer
2. ©2024 TVer INC. 2 自己紹介 小森英明(コモリヒデアキ) 株式会社TVer フロントエンド部 / iOSエンジニア X @mathtanguu 2023年10月 1人目iOSエンジニアとしてTVerに入社 趣味: ポケカ、欧州サッカー観戦、ドラマ鑑賞(笑うマトリョーシカ/スカイキャッスル)
3. ©2024 TVer INC. 3 TVerとは 民放テレビ局がひとつになった テレビの新しい プラットフォーム ドラマ バラエティ アニメ / ヒーロー 報道 / ドキュメンタリー スポーツ その他 見放題 ¥ 0
4. ©2024 TVer INC. 4 サービスの特徴 01 02 03 見逃し配信だけでなく、地上放送のリアルタイム配信も開始！ 好きな環境で 楽しめる！ 番組放送終了から 約7日間見放題！ リアルタイム配信 パソコン スマートフォン アプリ テレビアプリ タブレットアプリ すべて 無料 ※番組終了から配信までは、時間がかかることがあります ログインすれば 追っかけ再生も！
5. ©2024 TVer INC. 5 サービス規模
6. ©2024 TVer INC. 6 サービスの成長曲線 ▪ ダウンロード数、再生数、MUBにおいて順調に伸長 ▪ レギュラー番組の配信コンテンツは800番組以上に 万 億
7. ©2024 TVer INC. 7 現在のiOSチームの状況 2023/04 2023/09 2023/10 2024/03 2024/04 Android チーム 立ち上げ Androidエンジニア1人目採用 🎉 Android チーム 内製化 外部ベンダー依存の開発体制から 脱却 🎉 iOS チーム 立ち上げ iOSエンジニア1人目採用 🎉 iOS チーム 内製化 外部ベンダー依存の開発体制から 脱却 🎉 Web チーム 立ち上げ Webエンジニア1人目採用 🎉 QA チーム立ち上げ QAエンジニア1人目採用 🎉
8. ©2024 TVer INC. 8 現在のiOSチームの状況
9. ©2024 TVer INC. 9 現在のiOSチームの状況
10. ©2024 TVer INC. 01 現在の課題と推進しているアーキテクチャ、その採用背景について 10
11. ©2024 TVer INC. 現在の課題 • ViewController内にビジネスロジックを持っている箇所がある • 何重にもネストされた可読性が低い分岐処理 • 不必要な状態変数定義 • 並列処理にも関わらず実行順序に依存しているロジック • 不必要なラップにより階層が深くなっているクラス群 11
12. ©2024 TVer INC. 12 目指すアーキテクチャ • SwiftUI • TCA • Swift Package Managerを活用したマルチモジュール • Swift Playgroundを利用したデモアプリ • Atomic Designの導入 • Design Systemの導入 • Unit Test/Snap Shot Test/UI Test/E2E Test
13. ©2024 TVer INC. 採用背景 • Fluxベースで、他プラットフォーム(Android, Web)と同一なアーキテ クチャを採用することでエンジニア間のコミュニケーションコストを 削減したかった • TCAはデータフローに関して規則性があり、書き手に依存せず、Unit Testも含めてアウトプットが一定であることが期待できること TCA 13
14. ©2024 TVer INC. 現在のデザイン課題 • フォント定義やカラー定義などに曖昧さがあり、アプリ全体に適用で きていない • 非デザイナーが咀嚼しやすい形でデザインアウトプットがまとまって おらず修正による指摘漏れが多発しやすい • 命名が統一されておらず、他プラットフォームとのコミュニケーショ ンコストがかかる 14
15. ©2024 TVer INC. 採用背景 Design Systemの導入 15
16. ©2024 TVer INC. 採用背景 ルールを明文化 16
17. ©2024 TVer INC. 02 リスクを最小化するためのリリース戦略について 17
18. ©2024 TVer INC. リリースにおけるリスク リアーキテクチャ完了後のリリースは怖い • TVerは非常に多くの利用者を抱える巨大サービスになりつつある • クラッシュ率が0.1%でも数千万人の利用者がいる場合、数万人規模で 影響がでる • 過去にフルリニューアルをした際にユーザービリティが落ちてしまい 事業KPIへ悪影響を与えたことがある • iOSアプリをストア公開するにはAppleによる審査が必要で、すぐに ユーザーに反映させることはできない 18
19. ©2024 TVer INC. リリースにおけるリスク 一括リリースはもっと怖い • プロジェクト期間が長くスケジュールの不確実性が高すぎる • グロース施策に影響がでる可能性がある • 問題発生時の切り戻しの手段がhotfixしかなく、対応に時間がかかる 19
20. ©2024 TVer INC. 20 Home画面/機能
 ※あくまでもイメージ 
 Episode画面/機能 
 Series画面/機能 
 旧コード = RegacyAppFeature
 Home モジュール
 …
 ✨
 切り出されたモジュールの中で新しいアーキテク チャで実装。 一時的に1つのアプリの中に新しい コードと古いコードが混在した状態でリリース。 
 旧コード = RegacyAppFeature
 
 Home画面/機能
 Episode画面/機能 
 Series画面/機能 
 Home モジュール
 ✨
 リリース後、新しいモジュールでの動作確認が 完了次第古いコードを削除していく。詳細な進 め方は後述。
 旧コード = RegacyAppFeature
 Episode画面/機能 
 Series画面/機能 
 Episode モジュール 
 Home モジュール
 ✨
 ✨
 これを繰り返していくことで、新しいモジュー ルに入れ替えていく。 
 …
 …
 Episode モジュール 
 Home モジュール
 Series モジュール 
 ✨
 ✨
 ✨
 …
 最終的には1つの塊がモジュールに分割さ れ、アプリ全体のリアーキテクチャが完了 
 分割リリース マルチモジュール構成 + モジュールごとのアップデート
21. ©2024 TVer INC. 21 Feature Flagを用いた解放率のコントロール Phase.1 ストア公開 
 この時点では開放率は0% 
 新画面 
 旧画面 
 100%
 0%
 開放率 1% 
 開放率 10% 
 開放率 50%
 開放率100% 🎉
 モニタリングしつつ、開放率を徐々に上げていく 
 新画面は実装としては入っているが、まだユーザー公開 はされていない状態。 
 Firebase Remote Config等を用いて、ここをコントロール 可能にする。 
 新画面 
 旧画面 
 90%
 10%
 モニタリング項目 
 
 ・クラッシュ発生率
 ・お問い合わせ件数 
 ・事業KPIへの影響
 
 クラッシュの発生率やお問い合わせ件数、KPI影響等をモニタリングしながら、悪影響がないことを確認しつつ 開放率を上げていく。 
 悪影響がみられた場合には一旦開放率を0%に戻し旧画面へのロールバックを行う。 問題が解決したのち に再度開放率を上げていく。 
 これにより緊急対応、hotfixなどでエンジニアの稼働負荷が高まることを抑える。 
 Phase.1 リリース完了 
 新画面 
 旧画面 
 0%
 100%
 100%開放 完了後、旧画面のコードの削除を行い、次の フェーズでは完全に旧画面を無くした状態でリリースを 行う。
 問題発生時は 
 開放率を0%に戻す 
 各フェーズのリリースにおいても、段階的な解放を実施 削除可能
 ✨
 ✨
 ✨

22. ©2024 TVer INC. 22 Feature Flagを用いた開放率のコントロール 新画面
 旧画面
 90%
 10%
 モニタリング項目 ・クラッシュ発生率 ・お問い合わせ件数 ・事業KPIへの影響 
 問題発生時は 
 開放率を0%に戻す 
 ✨

23. ©2024 TVer INC. 分割リリースは大変 分割リリースによるデメリットと向き合う • 技術難易度が上がるので想定スケジュールより長くなることが予想で きる • バイナリサイズが大きくなる デメリットを許容してでも、多くのユーザーを抱えるTVerにとっては リスクを最小化することがサービスの努め 23
24. ©2024 TVer INC. 総括 24
25. ©2024 TVer INC. 25 総括 01 現在のアーキテクチャと推進しているアーキテクチャ、その採用背景について 02 リリースリスクを最小化するための戦略について
26. ©2024 TVer INC. 26 現在のiOSチームの状況
27. ©2024 TVer INC. 27 総括 Mission チーム1 
 Mission チーム2
 Mission チーム3
 事業KPIを元にMissionを設定し、複数チームを作り開発組織を 拡大させていきたい
28. ©2024 TVer INC. 28 総括
30. ご清聴ありがとうございました！ ©2024 TVer INC. 30