2025/3/18 サービスの成長で生じる幅広いパフォーマンスの問題を、 AIで手軽に解決する

Slide 1

Slide 1 text

CONFIDENTIAL  サービスの成⻑で⽣じる幅広いパフォーマンスの問題を、 AIで⼿軽に解決する 2025.3.18 NEWT Tech Talk vol.15

Slide 2

Slide 2 text

Slide 3

Slide 3 text

© 2025 Reiwa Travel, Inc.  パフォーマンスの改善はサービス成⻑をすると必然的に求められる ● パフォーマンスはサービスが成⻑すると優先順位があがる ○ 0→1：基本機能を揃えることがメイン ○ 1→10：成⻑が落ち着き、UXやCVRがよりシビアになる ● ⼀⽅で、サービスが成⻑するとパフォーマンスは(⼀般に)劣化する ○ 機能要件が複雑化 ○ マーケティングツールの導⼊ ○ プロダクトの細部に⽬が⾏き届かなくなる🫠 3 

Slide 4

Slide 4 text

Slide 5

Slide 5 text

Slide 6

Slide 6 text

Slide 7

Slide 7 text

Slide 8

Slide 8 text

Slide 9

Slide 9 text

Slide 10

Slide 10 text

Slide 11

Slide 11 text

© 2025 Reiwa Travel, Inc.  効果的に改善する = アクセス数が多いページから ● 例えば、利⽤規約やプライバシーポリシーよりも、リストページや詳細ページを少しでも改善したほうがより多くの⼈に良いUXを届けられる ● “効果的”に改善するために、アクセス数が多いページから取り掛かる ● コンバージョンまでのパスならなお良い ○ 今回はアクセス数が多い、appから開くツアー詳細ページを改善対象に 11 

Slide 12

Slide 12 text

Slide 13

Slide 13 text

Slide 14

Slide 14 text

© 2025 Reiwa Travel, Inc.  Lighthouseで問題を特定をする 14  ● FCP (First Contentful Paint) ○ 最初のコンテンツが表⽰されるまでの時間 ● LCP (Large Contentful Paint) ○ 最も⼤きなコンテンツが表⽰されるまでの時間 ● SI (Speed Index) ○ 画⾯内が視覚的に整うまでの時間 ...その他にも⾊々な指標があります

Slide 15

Slide 15 text

Slide 16

Slide 16 text

© 2025 Reiwa Travel, Inc.  ⼿軽に直せる改善ポイントの例 ● ⼀番⼤きい画像がlazy loadになっていた UIライブラリのカルーセルのデフォルトがlazy loadになっていることに気づかず実装 16  ● webview (app) では必要のないサポートチャット⽤ライブラリを読み込んでいた sp/pcと共通のコンポーネントを使っているために最適化されていなかったサービスが成⻑してパフォーマンスが悪くなっていた

Slide 17

Slide 17 text

© 2025 Reiwa Travel, Inc.  ⼿軽に直せる改善ポイントの例 ● ⼀番⼤きい画像がlazy loadになっていた UIライブラリのカルーセルのデフォルトがlazy loadになっていることに気づかず実装 17  ● webview (app) では必要のないサポートチャット⽤ライブラリを読み込んでいた sp/pcと共通のコンポーネントを使っているために最適化されていなかったサービスが成⻑してパフォーマンスが悪くなっていた 🎉

Slide 18

Slide 18 text

Slide 19

Slide 19 text

Slide 20

Slide 20 text

Slide 21

Slide 21 text

Slide 22

Slide 22 text

Slide 23

Slide 23 text

Slide 24

Slide 24 text

Slide 25

Slide 25 text

Slide 26

Slide 26 text

Slide 27

Slide 27 text

Slide 28

Slide 28 text

Slide 29

Slide 29 text

Slide 30

Slide 30 text

Slide 31

Slide 31 text

Slide 32

Slide 32 text

Slide 33

Slide 33 text

© 2025 Reiwa Travel, Inc.  ⼿軽にパフォーマンスを改善するポイント（まとめ） 33  ● サービスが成⻑するとパフォーマンスは気づいたら劣化している！ ● 継続モニタリングして改善対象を絞ると、⼿軽に(=要領よく)改善できる ○ コンバージョンパス上にあるアクセス数が多いページにする ● Lighthouseも使いつつ、DevToolsやAIも駆使しよう ○ ⼿軽に(=効率的に)問題が特定できます ● 幅広い観点を持つと、⼿軽に(=多⾯的に)改善できる ○ リソース観点（appに不要なチャットライブラリなど）だけでなく ○ 読み込みタイミング（例：分析ツールが早く読み込まれていた）や ○ 処理のボトルネックも気にしよう

Slide 34

Slide 34 text