PayPayフリマの速度改善

#wwdctokyo

Transcript

1. ©2021 Yahoo Japan Corporation All rights reserved. Update 起動体験 PayPayフリマの速度改善 ヤフー株式会社 CTO室アプリ統括部iOSアプリWG 平松亮介
2. ©2021 Yahoo Japan Corporation All rights reserved. iOSエンジニア 前期まで︓PayPayフリマ iOS 今期から︓CTO室 / Core ML Twitter: @himara2 ⾃⼰紹介 2 平松 亮介
3. ©2021 Yahoo Japan Corporation All rights reserved. このLTは PayPayフリマの起動速度を改善した話 3
4. ©2021 Yahoo Japan Corporation All rights reserved. • ヤフーの各サービスで起動速度の改善に取り組んでいる • PayPayフリマで実施した取り組みを紹介 • 起動速度のメンテナンスにCIを利⽤ 速度改善の取り組み 4
5. ©2021 Yahoo Japan Corporation All rights reserved. PayPayフリマのホーム画⾯ 5
6. ©2021 Yahoo Japan Corporation All rights reserved. PayPayフリマのホーム画⾯ 6 ݕࡧ૭
7. ©2021 Yahoo Japan Corporation All rights reserved. PayPayフリマのホーム画⾯ 7 ݕࡧ૭ ԣεΫϩʔϧλϒ
8. ©2021 Yahoo Japan Corporation All rights reserved. PayPayフリマのホーム画⾯ 8 ݕࡧ૭ ԣεΫϩʔϧλϒ Ωϟϯϖʔϯόφʔ
9. ©2021 Yahoo Japan Corporation All rights reserved. PayPayフリマのホーム画⾯ 9 ݕࡧ૭ ԣεΫϩʔϧλϒ Ωϟϯϖʔϯόφʔ ϋογϡλάϦϯά ϑΥϩʔͯ͠Δλάͷ৽ண঎඼
10. ©2021 Yahoo Japan Corporation All rights reserved. PayPayフリマのホーム画⾯ 10 ݕࡧ૭ ԣεΫϩʔϧλϒ Ωϟϯϖʔϯόφʔ ϋογϡλάϦϯά ϑΥϩʔͯ͠Δλάͷ৽ண঎඼ ͓͢͢Ί঎඼
11. ©2021 Yahoo Japan Corporation All rights reserved. 起動速度の計測（Watchful） 11
12. ©2021 Yahoo Japan Corporation All rights reserved. 起動速度の計測（Watchful） 12 起動⾃体は そこそこ速い
13. ©2021 Yahoo Japan Corporation All rights reserved. 起動速度の計測（Watchful） 13 起動⾃体は そこそこ速い コンテンツ表⽰に時間がかかっている
14. ©2021 Yahoo Japan Corporation All rights reserved. APIリクエストの⾒直し 14
15. ©2021 Yahoo Japan Corporation All rights reserved. • リリースから1年半で様々な機能が追加されてきた • ボトルネックはどこか︖まずはグラフにしてみる 複雑化するホーム画⾯ 15
16. ©2021 Yahoo Japan Corporation All rights reserved. 起動時に叩いているAPI 16 各種APIのendpoint endpoint/api/1 endpoint/api/2 endpoint/api/3 …
17. ©2021 Yahoo Japan Corporation All rights reserved. 17 起動時に叩いているAPI（主要API）
18. ©2021 Yahoo Japan Corporation All rights reserved. 18 起動時に叩いているAPI（主要API） 直列に叩いてる部分 を⼯夫できそう
19. ©2021 Yahoo Japan Corporation All rights reserved. • 0.5秒の短縮（17%の改善） APIリクエストを⾒直した結果 19
20. ©2021 Yahoo Japan Corporation All rights reserved. コンテンツキャッシュ 20
21. ©2021 Yahoo Japan Corporation All rights reserved. 21 コンテンツキャッシュ 初回 2回⽬ 以降 -BVODI $BDIFE
    DPOUFOUT /FUXPSL
    DPOUFOUT
22. ©2021 Yahoo Japan Corporation All rights reserved. 22 コンテンツキャッシュ 初回 2回⽬ 以降 -BVODI $BDIFE
    DPOUFOUT /FUXPSL
    DPOUFOUT
23. ©2021 Yahoo Japan Corporation All rights reserved. 23 コンテンツキャッシュ 初回 2回⽬ 以降 -BVODI $BDIFE
    DPOUFOUT /FUXPSL
    DPOUFOUT
24. ©2021 Yahoo Japan Corporation All rights reserved. 24 コンテンツキャッシュ 初回 2回⽬ 以降 -BVODI $BDIFE
    DPOUFOUT /FUXPSL
    DPOUFOUT
25. ©2021 Yahoo Japan Corporation All rights reserved. 25 コンテンツキャッシュ 初回 2回⽬ 以降 -BVODI $BDIFE
    DPOUFOUT /FUXPSL
    DPOUFOUT
26. ©2021 Yahoo Japan Corporation All rights reserved. 26 コンテンツキャッシュ 初回 2回⽬ 以降 -BVODI $BDIFE
    DPOUFOUT /FUXPSL
    DPOUFOUT
27. ©2021 Yahoo Japan Corporation All rights reserved. 27 コンテンツキャッシュ 初回 2回⽬ 以降 -BVODI $BDIFE
    DPOUFOUT /FUXPSL
    DPOUFOUT
28. ©2021 Yahoo Japan Corporation All rights reserved. 28 コンテンツキャッシュ 初回 2回⽬ 以降 -BVODI $BDIFE
    DPOUFOUT /FUXPSL
    DPOUFOUT
29. ©2021 Yahoo Japan Corporation All rights reserved. 29 コンテンツキャッシュ 初回 2回⽬ 以降 -BVODI $BDIFE
    DPOUFOUT /FUXPSL
    DPOUFOUT
30. ©2021 Yahoo Japan Corporation All rights reserved. • ハッシュタグリング • おすすめ商品 • ブランドランキング ※ログがおかしくならないように注意 キャッシュするもの 30
31. ©2021 Yahoo Japan Corporation All rights reserved. • iOS 12+で使えるパフォーマンス測定のAPI • Instruments や UI Testing で測定 計測︓OS Signpost 31
32. ©2021 Yahoo Japan Corporation All rights reserved. • iOS 12+で使えるパフォーマンス測定のAPI • Instruments や UI Testing で測定 • 今回の計測︓「最初の画像が表⽰されるまで」 計測︓OS Signpost 32
33. ©2021 Yahoo Japan Corporation All rights reserved. 時間計測のコード
34. ©2021 Yahoo Japan Corporation All rights reserved. 時間計測のコード
35. ©2021 Yahoo Japan Corporation All rights reserved. 時間計測のコード
36. ©2021 Yahoo Japan Corporation All rights reserved. UITestingで計測
37. ©2021 Yahoo Japan Corporation All rights reserved. UITestingで計測
38. ©2021 Yahoo Japan Corporation All rights reserved. 結果︓コンテンツキャッシュで⼤幅に改善 38 Wi-Fi 3G 2.13 5.45 Before After Improve 0.91 0.92 -1.22 -4.53 （単位︓秒 / iPhone 12 Pro 実機 / ⾃宅） • 「最初の画像が表⽰されるまで」の時間
39. ©2021 Yahoo Japan Corporation All rights reserved. （動画）
40. ©2021 Yahoo Japan Corporation All rights reserved. Static frameworksの利⽤ 40
41. ©2021 Yahoo Japan Corporation All rights reserved. • Dynamic frameworks → Static frameworks • Podfileを⼀⾏変更 Static frameworksの利⽤ 41
42. ©2021 Yahoo Japan Corporation All rights reserved. 起動時間の計測 42
43. ©2021 Yahoo Japan Corporation All rights reserved. 起動時間の計測 43 Xcode console
44. ©2021 Yahoo Japan Corporation All rights reserved. 起動時間の計測 44 Xcode console
45. ©2021 Yahoo Japan Corporation All rights reserved. Static frameworksの利⽤で改善 45 Dynamic Static 1.2 Improve -0.2 1.0 （単位︓秒 / iPhone 12 Pro 実機 / ⾃宅） Dynamic, Static それぞれ3回の平均値
46. ©2021 Yahoo Japan Corporation All rights reserved. • 本番環境では改善が⾒られず Xcode OrganizerでMetricsを確認 46
47. ©2021 Yahoo Japan Corporation All rights reserved. 1. APIリクエストの⾒直し 2. コンテンツキャッシュ 3. Sta*c frameworksの利⽤ ここまで ある程度の速度改善ができた 47
48. ©2021 Yahoo Japan Corporation All rights reserved. 1. APIリクエストの⾒直し 2. コンテンツキャッシュ 3. Static frameworksの利⽤ ここまで ある程度の速度改善ができた 48 起動速度が遅くなった時に気づける仕組みが欲しい
49. ©2021 Yahoo Japan Corporation All rights reserved. 1. 起動速度をUIテストで計測 2. そのUIテストをCIで定期的に実⾏ 3. 速度の低下を検知したらSlackに投稿 速度の定期的な計測 49
50. ©2021 Yahoo Japan Corporation All rights reserved. ワークフロー 50 コミット GitHub 定期実⾏ CI上でUIテストで計測 遅くなったら Slackへの通知
51. ©2021 Yahoo Japan Corporation All rights reserved. UITestingで起動速度を計測
52. ©2021 Yahoo Japan Corporation All rights reserved. UITestingで起動速度を計測
53. ©2021 Yahoo Japan Corporation All rights reserved. Slack通知
54. ©2021 Yahoo Japan Corporation All rights reserved. • 計測と改善を繰り返し、起動速度を改善 • 起動速度が低下した時に検知する仕組みづくり • UITesting、Metrics周りのアップデートも楽しみですね︕ おわりに 54
55. ©2021 Yahoo Japan Corporation All rights reserved.