GREE Tech Conference 2021 で発表された資料です。 https://techcon.gree.jp/2021/session/Session-11
REALITY株式会社 エンジニア 伊藤弘一郎REALITY株式会社 エンジニア 高塚翔悟アプリ起動時間高速化~推測するな、計測せよ~
View Slide
REALITY2アバター作成 ライブ配信 ギフト・コラボマルチプレイゲームライブ視聴
REALITY320202018 20198月視聴アプリ「REALITY」リリース1 0月配信アプリ「REALITY Avatar」リリース3月視聴/配信アプリ統合現在の「REALITY」リリース4月〜配信コラボ/ガチャチャットなど機能拡張が進む1 2月新Live配信基盤低遅延モード配信実装6月YouTube視聴やLiveゲームなどLive機能類が拡充11月初の海外リリース海外展開が加速。20218月ワールド機能のリリースメタバース事業に参入
REALITY4Q1Q2 Q3Q4Q1Q2Q420202021アクティブ配信者数国内15%海外85%ユーザ分布
REALITY5Q1Q2 Q3Q4Q1Q2Q420202021アクティブ配信者数国内15%海外85%ユーザ分布絶好調！？
6と言いたいところなんですが、規模拡大などに起因しさまざまな問題が起きています
7品質改善プロジェクト(SRE)紹介REALITY
1. 障害原因の調査、改善、それを継続して行う仕組みづくり1. スケーラブルなシステムの構築サービスの成長に合わせた利用ツールや環境構築方法の選定WebAPIの設計見直しによるリクエスト数の削減1. 高速化サーバのスループット改善レスポンス速度向上1. 自動化定常運用業務の自動化（Web, Nativeアプリ, Libraryのリリース作業など）による作業コスト削減同様にヒューマンエラーの抑止1. その他テスト文化の普及推進、定期的な進捗確認REALITY SRE8
半期に数件実施エンジニアが企画・進行を担当し、仕様書作成や効果測定までを行う品質改善プロジェクト9FY21上期終わりなき挑戦プロジェクト- 配信中フリーズ改善- アセットバンドルロード時間改善- 音声の安定化- 端末発熱改善FY21下期品質改善プロジェクト- エコーキャンセル- エラーハンドリング改善- 起動時間短縮- 見かけ上のUX改善FY22上期品質改善プロジェクト（WIP）- 通信速度向上のためのProtobuf対応- 不正ユーザ対策- メタバースに向けたアバター描画軽量化- US通信速度改善改善Week（半期ごと3回）- DevOps改善- コードリファクタ
品質改善プロジェクト10FY21上期終わりなき挑戦プロジェクト- 配信中フリーズ改善- アセットバンドルロード時間改善- 音声の安定化- 端末発熱改善FY21下期品質改善プロジェクト- エコーキャンセル- エラーハンドリング改善- 起動時間短縮- 見かけ上のUX改善FY22上期品質改善プロジェクト（WIP）- 通信速度向上のためのProtobuf対応- 不正ユーザ対策- メタバースに向けたアバター描画軽量化- US通信速度改善改善Week（半期ごと3回）- DevOps改善- コードリファクタ半期に数件実施エンジニアが企画・進行を担当し、仕様書作成や効果測定までを行う
半期に数件実施エンジニアがPMを担当し、エンジニアが仕様書作成や効果測定までを行う品質改善プロジェクト11FY21上期終わりなき挑戦プロジェクト- 配信中フリーズ改善- アセットバンドルロード時間改善- 音声の安定化- 端末発熱改善FY21下期品質改善プロジェクト- エコーキャンセル- エラーハンドリング改善- 起動時間短縮- 見かけ上のUX改善FY22上期品質改善プロジェクト（WIP）- 通信速度向上のためのProtobuf対応- 不正ユーザ対策- メタバースに向けたアバター描画軽量化- US通信速度改善改善Week（半期ごと3回）- DevOps改善- コードリファクタ
品質改善プロジェクト12FY21上期終わりなき挑戦プロジェクト- 配信中フリーズ改善- アセットバンドルロード時間改善- 音声の安定化- 端末発熱改善FY21下期品質改善プロジェクト- エコーキャンセル- エラーハンドリング改善- 見かけ上のUX改善FY22上期品質改善プロジェクト（WIP）- 通信速度向上のためのProtobuf対応- 不正ユーザ対策- メタバースに向けたアバター描画軽量化- US通信速度改善改善Week（半期ごと3回）- DevOps改善- コードリファクタ半期に数件実施エンジニアがPMを担当し、エンジニアが仕様書作成や効果測定までを行う- 起動時間短縮
13起動時間短縮プロジェクトREALITY
「ランチャーアイコンタップからコンテンツ表示までの時間」と定義アプリの起動時間はUX/ユーザの離脱率に影響起動時間とは14何秒かかった？
プロジェクトの進行151. 計測アプリ起動処理の全体像の把握問題箇所に目星を付け、対応項目別に優先度整理する2. 実装3. リリース後の計測・運用それぞれの項目別に調査・改善する本番環境で実際に改善されているか確認する継続的に監視できる基盤を整える
プロジェクトの進行161. 計測アプリ起動処理の全体像の把握問題箇所に目星を付け、対応項目別に優先度整理する2. 実装3. リリース後の計測・運用それぞれの項目別に調査・改善する本番環境で実際に改善されているか確認する継続的に監視できる基盤を整える
REALITYはNativeアプリにUnityをライブラリとして含む構成-> 「Unityライブラリ初期化がボトルネックかな？」プロジェクト開始前の見立て17推測Native UnityiOS アプリ起動時に初期化-> 起動処理のボトルネックと推測Android Unity画面起動時に初期化-> なんらか起動処理の遅延に影響と推測※Unityライブラリ初期化について
1. アプリ起動シーケンスの調査• ボトルネックに目星を付ける• 改善可能な箇所の精査1. 本番環境での起動処理周りの実態調査• [Client] Firebase : Performance Monitoring• [Server] GCP : Stackdriver Trace計測18
XCode：Instruments (Time Profiler, Signposts)iOSの起動シーケンスを確認19認証APIログインAPIUnity初期化配信一覧取得アプリ起動処理の全体像の把握：iOS認証APIログインAPIUnity初期化配信一覧取得
20アプリ起動処理library(dlib)初期化等重い。。。認証APIログインAPIUnity初期化配信一覧取得XCode：Instruments (Time Profiler, Signposts)iOSの起動シーケンスを確認アプリ起動処理の全体像の把握：iOS認証APIログインAPIUnity初期化配信一覧取得 重い？妥当？要調査遅い
Android Studio：CPU ProfilerAndroidの起動シーケンスを確認21アプリ起動処理の全体像の把握：Android
22😅< あれ、ボトルネックじゃなくない？Android Studio：CPU ProfilerAndroidの起動シーケンスを確認アプリ起動処理の全体像の把握：Android
「Unityライブラリ初期化がボトルネックかな？」調査・計測から23
「Unityライブラリ初期化がボトルネックかな？」「アプリ起動処理・配信一覧画面初期化処理の高速化がコスパ良」調査・計測から24
Firebase：Performance Monitoring• Clientのパフォーマンス計測に利用• Client処理の区間トレースが可能。DashBoard化してくれる。25アプリ起動処理の全体像の把握：ユーザ環境での計測
Firebase：Performance Monitoring• 開発者の手元環境ではなく、実際のユーザ環境での起動時間を認識する• ネットワークリクエストの応答時間を国/デバイス別に確認できる26アプリ起動処理の全体像の把握：ユーザ環境での計測ログインAPIの例：ユーザ環境において日本とブラジルで300 msec以上差を確認
Firebase：Performance Monitoring• 開発者の手元環境ではなく、実際のユーザ環境での起動時間を認識する• ネットワークリクエストの応答時間を国/デバイス別に確認できる27アプリ起動処理の全体像の把握：ユーザ環境での計測全世界 日本iOS 6.2 秒 5.2 秒Android 6.5 秒 4.2 秒ユーザ環境における起動時間の中央値(2021/03)😅< めっちゃ遅い
GCP：Cloud Trace• GCPの分散トレーシングシステム• ボトルネックの検出• レイテンシ分布の可視化28改善前配信一覧取得APIのトレース• 処理のタイムシーケンスを可視化• ボトルネックの可視化並列化できない？不必要な処理が多いアプリ起動処理の全体像の把握：サーバ処理
1. [client] アプリの起動処理改善Android最適化 : App Startup導入、キャッシュ改善などiOS最適化：謎のblankを削除、library初期化処理改善など1. [server] 配信一覧取得API高速化並列処理、ボトルネック改善にて対応1. [client] UnityLibrary初期化改善 (optional)調査を行い、現実的な規模の改修で時間を短縮できれば改善を入れる空シーン起動など対応優先度を決定29
プロジェクトの進行301. 計測アプリ起動処理の全体像の把握問題箇所に目星を付け、対応項目別に優先度整理する2. 実装3. リリース後の計測・運用それぞれの項目別に調査・改善する本番環境で実際に改善されているか確認する継続的に監視できる基盤を整える
31Android編起動時間短縮
32Androidの起動処理改善のフロー1.ボトルネックのあたりをつける2.コードレベルで問題箇所を特定する3.修正を入れる
33Androidの起動処理改善のフロー1.ボトルネックのあたりをつける2.コードレベルで問題箇所を特定する3.修正を入れる
34起動処理のボトルネック検出手法Jetpack Macro Benchmark• テストを実行する形で起動時間を計測可能• cold/warm/hot start の計測• テスト結果をトレースファイルとして閲覧• Android 10(API 29)以上で利用可能logcat• スタックトレースやシステムメッセージのログをダンプするコマンドラインツール• 起動処理のスタックトレースを細かく取れる
35Androidの起動処理計測の例ApplicationonCreateActivityinitActivityonCreateその他inflate viewsetcアカウント認証ログイン処理etc
36Androidの起動処理計測の例ApplicationonCreateActivityinitActivityonCreateその他inflate viewsetcアカウント認証ログイン処理etc画面の生成コンテンツ表示
37Androidの起動処理計測の例ApplicationonCreateActivityinitActivityonCreateその他inflate viewsetcアカウント認証ログイン処理etcDisplayed timeFully Drawn time
ActivityTaskManagerでlogcatに起動時間を出力38logcatによる計測の例
ActivityTaskManagerでlogcatに起動時間を出力39logcatによる計測の例I/ActivityTaskManager: Displayed ***************** + 4s80msDisplayed timeに4.08 sかかっている
ActivityTaskManagerでlogcatに起動時間を出力40logcatによる計測の例I/ActivityTaskManager: Fully drawn ************* + 5s529msFully Drawn timeは5.529 s
ActivityTaskManagerでlogcatに起動時間を出力41logcatによる計測の例つまりその他は 1.449sみたいに計測できる今回は前半部分を細かく計測していく
42認証APIログインAPIUnity初期化配信一覧取得XCode：Instruments (Time Profiler, Signposts)iOSの起動シーケンスを確認アプリ起動処理の全体像の把握：iOS認証APIログインAPIUnity初期化配信一覧取得今回細かく見たいのはここ
43Androidの起動処理ApplicationonCreateActivityinitActivityonCreateその他inflate viewsetcアカウント認証ログイン処理etcDisplayed timeFully Drawn timeここのボトルネックを探す
44Androidの起動処理ApplicationonCreateActivityinitActivityonCreateその他inflate viewsetcアカウント認証ログイン処理etcDisplayed timeFully Drawn timeより細かく調べていく
45Androidの起動処理ApplicationonCreateActivityinitActivityonCreateその他inflate viewsetcアカウント認証ログイン処理etcDisplayed timeFully Drawn timeより細かく調べていく
46Androidの起動処理改善のフロー1.アプリ起動処理の全体像を眺める2.コードレベルで問題箇所を特定する3.修正を入れる
47CPU Profilerでの特定各スレッドを開くと時系列に沿った各メソッドの実行時間が確認できる
48CPU Profilerでの特定各スレッドを開くと時系列に沿った各メソッドの実行時間が確認できる気になる処理をポチると
49Frame Chartでさらに詳しく左から実行時間の長い順に並ぶ
50Frame Chartでさらに詳しく左から実行時間の長い順に並ぶここに時間がかかってる
51Androidの起動処理改善のフロー1.アプリ起動処理の全体像を眺める2.コードレベルで問題箇所を特定する3.コードに修正を入れる
52処理を短縮するには大まかに分けて3つ• キャッシュを入れる• 処理の並列化・平行化• 不要な処理の削除（遅延）
53キャッシュを入れる配信一覧のキャッシュ配信一覧のコンテンツがロードされていない間はキャッシュしたデータを表示して待機時間をなくす
54並列化・並行化AppStartupの導入ContentProviderによるライブラリ初期化を最適化する
55不要な処理の削除（遅延）起動時にやる必要がない処理や、そもそも不要な処理は削除したり起動時以外のタイミングに移動例・不要なdelayが入っていたのを削除・ローディング表示の修正泥臭い地道な計測や処理の改善が必要。。。
56Server編起動時間短縮
配信一覧取得APIの特徴• View初期化のためアプリ起動処理に使用• レイテンシがUXに直結配信一覧取得APIの高速化57認証APIログインAPIUnity初期化配信一覧取得1秒以上の遅延認証APIログインAPIUnity初期化配信一覧取得
配信一覧取得APIの特徴• View初期化のためアプリ起動処理に使用• レイテンシがUXに直結大まかな処理• 最初の画面すべてのコンテンツを生成して返す• フォロータブ• おすすめタブ• … etc (計7タブ)• それぞれのタブをソートなど（パーソナライズ）• 配信リスト• 相互フォローリスト• ゲームリスト• … etc配信一覧取得APIの高速化58
GCP：Cloud Trace• GCPの分散トレーシングシステム• ボトルネックの検出• レイテンシ分布の可視化59改善前配信一覧取得APIのトレース• 処理のタイムシーケンスを可視化• ボトルネックの可視化並列化できない？不必要な処理が多い配信一覧取得APIの高速化
配信一覧取得APIの高速化60必要リソースのFetchタブのコンテンツ生成大量のFetchHogehogeが並ぶ並列化すべき箇所が並列化されていない
配信一覧取得APIの高速化61余談：REALITY APIサーバはGolang製goroutineによる並列化を行う
配信一覧取得APIの高速化62並列化並列化
配信一覧取得APIの高速化さらに、配信一覧画面初期化には必要のない処理・情報を削減画面初期化に必要な情報だけ返し、残りは遅延して取得させる処理の削減
ログイン時APIリクエストを一つに統合複数リクエストする際のオーバーヘッドを削減ログインAPIと配信一覧取得APIを合体64認証APIログインAPIUnity初期化配信一覧取得統合認証APIログインAPIUnity初期化配信一覧取得
処理の最適化65遅いリクエストCloud Traceのレイテンシグラフでは遅いリクエストなど抽出可能該当リクエストのTraceを参照して、改善する
処理の最適化66Cloud Profiler• GCPで利用可能なプロファイラ• 関数単位でCPUTimeやHeapを確認可能
処理の最適化67Cloud Profiler不要なデータを大量に取得しており、jsonのdesirializeに時間がかかっている。これも改善。（泥臭い案件）
もともと配信一覧アイコンは 1024×1024 のpngを使用• 256×256 のwebpに変換し軽量化• サイズを 96~99 % 程度カットClientのクラッシュ率低下、CDN費用削減の副次効果も画像読み込み高速化68https://developers.google.com/speed/webp
69本番リリース起動時間短縮
70改善前の起動時間全世界 日本iOS 6.2 秒 5.2 秒Android 6.5 秒 4.2 秒ユーザ環境における起動時間の中央値(2021/03)
結果71※手元環境での実測（日本ユーザ環境 iOS:2.3 s, Android, 2.5s 程度）
プロジェクトの進行721. 計測アプリ起動処理の全体像の把握問題箇所に目星を付け、対応項目別に優先度整理する2. 実装3. リリース後の計測・運用それぞれの項目別に調査・改善する本番環境で実際に改善されているか確認する継続的に監視できる基盤を整える
本番リリース後に大幅に起動時間を短縮したことを確認Firebase Performance Monitoring73
本番リリース後に大幅に起動時間を短縮したことを確認Firebase Performance Monitoring74
監視用のログ入れて何か効果あった？75
76とある変更により、起動時間が悪化したことを検知😅< なんかめっちゃ悪化しとる監視用のログ入れて何か効果あった？
監視用のログ入れて何か効果あった？77とある変更により、起動時間が悪化したことを検知😅< なんかめっちゃ悪化しとる即検知、即修正効果は大いにあった
監視用のログ入れて何か効果あった？78とある変更により、起動時間が悪化したことを検知😅< なんかめっちゃ悪化しとる遅くしない運用を作る
ログを活用できていないのは、ログを取っていないのと同じ• Slackに流す、アラートを設定する遅くしないための運用79
ログを活用できていないのは、ログを取っていないのと同じ• 誰が見ても理解できるようにダッシュボード化する• 定例mtgやリリースmtgなどで都度確認する遅くしないための運用80Data Portal（BIツール）Performance Monitoring↓BigQuery↓Data Portalにデータをエクスポートして使用
まとめ起動時間短縮は泥臭い作業の積み上げにより実現• 並列化、キャッシュ、処理の削減（遅延）など本プロジェクトでは、計測により• 想定とは異なるボトルネックの存在確認• 継続的に監視できる基盤を作成計測・監視はパフォーマンス改善や不具合の早期検知をするためには必要「問題が生じてからログを入れる」のではなく、常日頃から「監視できる仕組みを作る」ことが望ましい81本事例では、「品質改善プロジェクト」としてエンジニア主体で進行できたのが良かったかな感
余談本プロジェクトをnote等で技術発信して、ユーザから感触の良い評価を得られた今回の事例の他にも• 端末の発熱• 配信中の入出力音声の音量測定などREALITYユニークな計測事例もあり、REALITYのnoteで掲載中82https://note.com/reality_eng
絶賛エンジニア募集中！83meetywantedlyREALITYの未来を作ってくれる人を募集中！是非、ご応募ください！
84
gree_tech
non97
moriyuya
.png){kind=icon}
pharma_x_tech
kazumax55
colopl
lmt_swallow
ryomaru0825
linedevth
nishiuma
dahatake
yoshiiryo1
chriscoyier
schacon
garrettdimon
jponch
geeforr
eileencodes
jrom
samlambert
addyosmani
tammielis
malarkey
jonyablonski