劣悪なユーザー エクスペリエンスを検出して解決するために必要な Web テレメトリがあることを確認してください。このガイドは、適切なデータを取得していることと、それを最大限に活用できるようにブラウザが設定されていることを確認する方法を示し、そのために役立ちます。
前提条件 Web アプリケーションには New Relic Browser が組み込まれています Web アプリケーションは Pro + SPA 用に構成されています このガイドでは、次のことを確認して調整します。
ブラウザ アプリケーションの名前付けとサブアカウントの配置を調整する 命名とデータ構成はどうなっていますか?
異なる環境 (dev/qa/production) からの Web アプリケーション インストルメンテーションは、異なるブラウザ アプリケーションにレポートする必要があります。 開発者、運用担当者、および製品所有者は、サブアカウント名とブラウザ アプリケーション名を使用して次のことを解決できます。 ブラウザ アプリケーションがサポートする環境 (開発環境、QA 環境、運用環境など)。 ブラウザ アプリケーションの目的 (顧客向け、内部向け、Web サイト、Web サイト コンポーネント、地域など)。 変更が必要ですか?
複数の環境からのデータを 1 つのブラウザ アプリケーションにレポートしている場合は、 新しいブラウザ アプリを作成し 、ページ内の JavaScript スニペットを更新して適切なアプリをレポートできます。 名前変更ガイド に従ってブラウザ アプリケーションの名前を変更できます。 JS エラーを調整する JavaScript エラーは、ページ読み込みプロセスを中断し、エラーを表示し、ユーザーがアクションを完了できなくなることにより、ユーザー エクスペリエンスと SEO に悪影響を及ぼします。JavaScript エラーを追跡して解決するために必要なデータがあることを確認してください。
JavaScript エラーがキャプチャされていることを確認してください。 UI経由 ブラウザで Web アプリケーションを開きます。左側のメニューの下にある「エラー」ビューを開き、JavaScript エラーが表示されることを確認します。アプリケーションが大量のトラフィックを取得していない場合、エラーを確認するには 24 時間以上前に戻る必要がある場合があります。
NRQL経由 次のクエリを実行します。
SELECT count(*) FROM JavaScriptError WHERE appName = 'MyApp' SINCE 1 WEEK AGO
カウント 0 は、JavaScript エラーが捕捉されていないことを意味します。
次のコマンドを実行すると、サブアカウント内のすべての Web アプリケーションを確認できます。
SELECT count(*) FROM JavaScriptError FACET appName LIMIT MAX SINCE 1 WEEK AGO
結果に存在しない Web アプリケーションは JavaScript エラーを報告していません。
JavaScript 欠落エラーは次の方法で解決できます。
ブラウザ エージェントが最新であることを確認します。新しいブラウザのバージョンでは、何らかの理由でこれまで見落とされていた JavaScript エラーが捕捉される場合があります。 ブラウザ エージェントがページの <HEAD/>
タグに配置されていることを確認します。Chrome 開発者ツールを使用してこれを確認できます。 AngularJS エラーが見つからない場合は 、次の手順 に従ってください。 ブラウザ エージェントがエラーを確認する前に、サイトでエラーを処理するエラー ハンドラーが使用されているかどうかを確認します。 JavaScript エラーの サポート内容を 確認します。 NoticeError API を使用して欠落エラーをキャプチャします。JavaScript エラーにイベント ログがあることを確認してください。イベント ログには、JS エラーにつながるブラウザの対話、AJAX 呼び出し、およびトレースが表示されます。これは、エラーの根本原因のトラブルシューティングに役立ちます。 UI経由 イベント ログをキャプチャしていることを確認するには、[JS エラー] タブに移動します。いくつかの異なるエラーをドリルダウンして、イベント ログが表示されることを確認します。
イベント ログが見つからない場合のトラブルシューティングを行うには、 次の手順 に従ってください。
JavaScript エラーにスタック トレースがあることを確認してください。 UI経由 [JS エラー] タブからいくつかのエラーをドリルダウンします。スタック トレースがエラー イベント ログの下に表示されます。
NRQL経由 次のクエリを実行します。
SELECT count(*) FROM JavaScriptError WHERE appName = 'MyApp' AND stackTrace IS NOT NULL AND stackTrace NOT LIKE '' SINCE 1 WEEK AGO
カウント 0 は、JavaScript エラーが捕捉されていないことを意味します。
次のコマンドを実行すると、サブアカウント内のすべての Web アプリケーションを確認できます。
SELECT count(*) FROM JavaScriptError WHERE stackTrace IS NOT NULL AND stackTrace NOT LIKE '' FACET appName LIMIT MAX SINCE 1 WEEK AGO
結果に存在しない Web アプリケーションには、スタック トレースに JavaScript エラーがありません。
スタック トレースが見つからない場合のトラブルシューティングを行うには、 次の手順に 従ってください。または、スタック トラックが表示されても縮小を解除できない場合は、 次の手順 に従ってください。
ページビューのグループ化を確認する ページ ビュー UI のページ URL は、ページのパフォーマンスをより適切に管理できるように自動的にグループ化されます。自動グループ化を決定するアルゴリズムは、Web アプリが初めてインストルメント化されるときに実行されます。現在の Web トラフィックが、アプリが最初にインストルメントされたときと大きく異なる場合は、表示されるグループが少なすぎる可能性があります。
UI経由 左側のメニューからアプリを選択して、アプリのページ ビュー UI を確認します。表示されている内容が以下のスクリーンショットとよく似ている場合は、メモを取り、このガイドの指示に従って対処してください。
NRQL経由 次のクエリを実行します。
SELECT count(*) from PageView WHERE appName = 'MyApp' AND browserTransactionName LIKE '*.*.*%/%' or browserTransactionName LIKE '%.%.%/*/*/*/%' or browserTransactionName LIKE '%.%.%/*/*/*' or browserTransactionName LIKE '%.%.%/*/*/%' FACET pageUrl limit 100 SINCE 1 WEEK AGO
結果には、アプリに対してどのページ URL が過剰にグループ化されている可能性があるかが示されます。
次のコマンドを実行すると、サブアカウント内のすべての Web アプリケーションを確認できます。
SELECT count(*) from PageView WHERE browserTransactionName LIKE '*.*.*%/%' or browserTransactionName LIKE '%.%.%/*/*/*/%' or browserTransactionName LIKE '%.%.%/*/*/*' or browserTransactionName LIKE '%.%.%/*/*/%' FACET browserTransactionName, pageUrl limit 100 SINCE 1 WEEK AGO
結果として、複数のアプリに対して同じデータが得られます。
セグメント許可リスト を使用して、ページ ビュー URL がグループ化される方法を調整します。
AJAX 呼び出しのグループ化を確認する AJAX 呼び出しは、大規模な操作を容易にするためにグループ化されています。場合によっては、AJAX 呼び出しが非常に多く、個別のリクエスト URL ごとにそれらをナビゲートするのが煩雑になることがあります。AJAX グループ化を調整する必要があるかどうかを確認するには、次の手順に従ってください。
UI経由 左側のメニューからアプリを選択し、 groupedRequestUrl でグループ化して、アプリの AJAX グループ化を確認します。表示されている内容が以下のスクリーンショットとよく似ている場合は、メモを取り、このガイドの指示に従って対処してください。
NRQL経由 次のクエリを実行します。
SELECT count(*) FROM JavaScriptError WHERE appName = _your app name_ AND stackTrace IS NOT NULL AND stackTrace NOT LIKE '' SINCE 1 WEEK AGO
カウント 0 は、JavaScript エラーが捕捉されていないことを意味します。
次のコマンドを実行すると、サブアカウント内のすべての Web アプリケーションを確認できます。
SELECT count(*) FROM JavaScriptError WHERE stackTrace IS NOT NULL AND stackTrace NOT LIKE '' FACET appName LIMIT MAX SINCE 1 WEEK AGO
結果に存在しない Web アプリケーションには、スタック トレースに JavaScript エラーがありません。
セグメント許可リスト を使用して、AJAX リクエストがどのようにグループ化されるかを調整します。
ディストリビューティッド(分散)トレーシングの有効化 ブラウザーの分散トレースは、 バックエンドへのリクエストを最終エンドポイントに至るまで追跡することで、AJAX のパフォーマンスを向上させるのに役立ちます。トレース情報は、どのアプリケーションがユーザー エクスペリエンスに影響を与えているかを理解するのに役立ちます。この情報を使用して、サービスの問題に自分で対処したり、担当チームに委任したりできます。
デプロイメントをセットアップする NerdGraph を使用して Web アプリケーションの変更を追跡する と、パフォーマンス KPI、コンバージョン、ユーザー エンゲージメントに対する変更の影響を確認できます。
カスタム属性の追加 カスタム属性を 使用してデータをフィルタリングおよびグループ化します。カスタム属性はオプションですが、多くの価値を提供します。以下は、最も一般的に推奨される属性です。多くの顧客はさらに追加します。
ユーザー 識別可能なユーザーがいるすべてのサイトに推奨されます。エラー受信箱の ドキュメントに記載されている規則に従って、エラーの影響を受けるユーザーの数を特定し、どのユーザーを特定できるようにします。
お客様 SLA を満たしたり、サポート リクエストを詳しく調査したりするために、特定の顧客のエクスペリエンスを測定します。
小売業者向けの追加のカスタム属性カートの値 コンバージョン収益をリアルタイムで追跡します。カート放棄やチェックアウト時の問題の影響を測定します。
アイテム数 購入したアイテムをリアルタイムで追跡します。カート放棄やチェックアウト時の問題の影響を測定します。
広告キャンペーンやプロモーションの結果としてサイトにアクセスするユーザーの数を把握します。コンバージョンに対するプロモーションの影響を測定します。
店 ストアをキャプチャして、Click-to-Collect のパフォーマンスに関する情報を収集します。店内ショッピング Web アプリケーションのパフォーマンスを測定します。
製品 製品 ID がページ URL にまだキャプチャされていない場合に便利です。この情報を使用して、どの製品ページのパフォーマンスが低下しているかを確認します。どの製品ページが最も多くのトラフィックを受信し、どの製品ページが最も少ないトラフィックを受信しているかを把握します。
価値の実現このガイドの手順に従うことで、チームは New Relic Browser から最大限の価値を確実に得ることができます。これにより、次のことが保証されます。
収集したデータから最大限の価値を引き出す 最適化の機会を見つける 迅速なトリアージとトラブルシューティングが可能 リアルタイムのビジネス KPI ダッシュボードを作成するために必要なデータを取得する