シナリオ：Kai が Splunk RUM for Browser でパフォーマンスのボトルネックを特定する 🔗
次のシナリオは、架空のeコマース企業である Buttercup Industries を取り上げています。
このシナリオについて 🔗
Kai is a site reliability engineer at Buttercup Industries e-commerce company. One of Kai’s main concerns is monitoring the performance of the Buttercup Industries website. When sites are sluggish, users get frustrated and are more likely to abandon a slow site in favor of a faster competitor. In this example, Kai uses Splunk RUM for Browser and Splunk Observability Cloud to identify performance bottlenecks and monitor Web Vitals so that they can troubleshoot customer facing issues on the Buttercup Industries website.
ウェブバイタル 🔗
Google’s Core Web Vitals quantify user experience in terms of page load, visual stability, and interactivity, making them valuable metrics to improve frontend performance. Web Vitals also affect page ranking in Google, which is important for many businesses that rely on search engines for users to discover their sites. Splunk RUM automatically measures Web Vital metrics so Kai can tune into the overview page to check in on the metric scores.
ウェブバイタルは、ユーザーエクスペリエンスを測定する3つのメトリクスで構成されています：
LCP（最大コンテンツの描画）
CLS（累積レイアウトシフト）
INP（インタラクションから次の描画まで）
ウェブバイタルをモニターする 🔗
ウェブバイタルをモニターするために、Kai は以下のステップに従います：
Kai がRUMを開きます。メインナビゲーションパネルから、RUM と ブラウザ をソースとして選択します。
次の画像は、アプリケーションのサマリーダッシュボードを示しています。Kai は、アプリケーションの健全性に関する以下のような主要なメトリクスを見ることができます：
ウェブバイタル
ページビュー／エラー
ネットワークリクエスト/エラー
JavaScriptエラー
ディテクター
アプリケーションサマリーダッシュボードで、Kai はLCPのパフォーマンススコアが低いことを確認しました。
Kai がLCPのメトリクスをクリックすると、Tag Spotlightで詳細を見ることができます。
Kaiは、概要ページで任意のメトリクスを選択して、Tag Spotlightにアクセスすることもできます。Tag Spotlightでは、エンドポイント、ページ、環境、操作などでセッション集約をフィルタリングできます。
Tag SpotlightでKai は、サイトのP99のロード時間が異常に遅く、Chrome ユーザーで53.86秒であることを確認します。
この画像は、Tag Spotlightにおけるブラウザのメトリクスを示しています。グラフのバーの幅が示すように、Chromeのユーザーが最も多数です。
ユーザーセッションをドリルダウンして、読み込みの遅さをトラブルシューティングする 🔗
Tag Spotlightで、Kai はウェブサイトの読み込み速度が低下している原因を発見しました。さらに詳しく調べるために、Kai は ユーザーセッション を開きます。セッションの例を見ることで、Kaiは待ち時間の問題の原因を調べることができます。
Kai は、ユーザーセッション タブを選択して、Tag Spotlight からユーザーセッションを開きます。
Tag Spotlight ビューのユーザーセッションタブは、選択したフィルターに基づいて、特定の特性を含むセッションを表示します。
KaiはLCPの継続時間でユーザーセッションをソートし、ロード時間の長いセッションを掘り下げます。Kaiは、次の画像のようにセッションIDを選択することで、セッションの詳細を開きます。
[セッションの詳細] ビューで、Kai はロード待ち時間が次の画像のようなサードパーティのリソースによるものであることを発見します。
Kaiは遅延がサードパーティのリソースに起因していることを知っているので、自社のサービスが問題を引き起こしていないという保証を得ることができます。次に、問題を報告し、サードパーティリソースのステータスをチェックして、サービスがダウンしているかどうかを確認することができます。
概要 🔗
このシナリオでは、Kai は、Buttercup Industries のウェブサイトのパフォーマンスの問題を、次のようにして特定しました：
アプリケーションサマリーダッシュボードでウェブバイタルを監視し、LCPが遅いことを確認しました。
Tag Spotlightのデータを調査したところ、読み込みに問題があることが判明しました。
トラブルシューティングのためにユーザーセッションを開き、リソースのロードの問題がサードパーティベンダーによるものであることを知りました。
この問題をButtercup Industriesの開発チームに報告し、問題を再現して修正できるようにしました。
ウェブバイタルスコアの向上を支援することで、Kai はサイトの検索エンジン最適化の向上にも貢献しました。
Splunk Observability Cloud での体験を最適化する方法については、以下のリソースをご覧ください：
サブジェクト |
リソース |
|---|---|
ビデオチュートリアルとブログ記事 |
|
Splunk RUM ドキュメント |