white light in the middle with rays radiating out in blue, purple, and green.

フロントエンドモニタリングの2つの方式である、リアルユーザモニタリング(RUM: Real-User Monitoring)と合成モニタリング(Synthetics Monitoring、「外形監視」とも呼ばれています)について解説した記事 Synthetic vs Real-User Monitoring: How to Improve Your Customer Experience の抄訳です。

ユーザがサービスを問題なく利用できているか、どのように理解すればいいか?どんなデータを集めればいいか?より良くするにはどうしたらいいか?そのような問いに答えてくれます。

企業の収益に対するオンラインサービスへの依存度は高まっており、ウェブサイトの速度や可用性、パフォーマンスがこれまで以上に重要になっています。ガートナーの調査によると、サイトが利用できない場合、企業は1分あたり平均5,600ドル、1時間あたり300,000ドル以上の損失を出してしまいます。しかもこれは、2014年の調査です(訳注: オリジナルの記事は2019年9月に書かれました)!もちろん速度も重要で、BBCの調査によると、ページのロード時間が1秒増えるごとに10%のユーザーがサイトを離れていくと言われています。そして一般的に、デジタル資産を監視し、測定し、改善することは、優れたデジタル顧客体験(DCX: Digital Customer eXperience)を創造する鍵となります。

DevチームやOpsチームにとって、ウェブサーバの可用性とパフォーマンスを監視すれば、顧客がどのような可用性とパフォーマンスでサービスを利用しているかの表層的なフィードバックが得られます。より深く掘り下げるには、ウェブサイトとエンドユーザーをモニタリングすることで、デジタル体験の長期的な改善をも促進することができます。適切なタイプのモニタリングを実施することで、ページパフォーマンス改善に対してデータドリブンな決定を下すことができ、収益の増加などのビジネスニーズを満たすという目標をクリアできるようになります。

アプリケーションとインフラストラクチャのモニタリングを導入し、サーバーサイドのパフォーマンス問題に焦点を当てることはとても重要です。しかし、ユーザーは、Webブラウザでページがレンダリングされるのを待つために大部分を浪費します。したがって、システムがユーザーに与える影響を完全に理解すべく、できるだけ広範で徹底的な監視を実現することが求められます。バックエンドとフロントエンドの両方の監視ソリューションを活用して、ソフトウェア、インフラストラクチャ、顧客体験などの関係性を追跡する必要があります。

つまり、ウェブサイトのパフォーマンスの問題に対処したり、デジタル顧客体験を向上させるための戦略を実行する際には、フロントエンドモニタリングが必要不可欠となります。

この記事では、これらの課題を解決するために知っておくべき3つのことを説明します:

  1. フロントエンド(エンドユーザー)のモニタリングは、デジタルビジネス戦略を成功させるために不可欠な要素です。エンドユーザー体験を理解し、ウェブサイトのパフォーマンスとビジネスの健全性との関係を理解することが重要です。
  2. フロントエンドのモニタリングには、リアルユーザーモニタリング(RUM: Real-User Monitoring)と合成モニタリング(Synthetic Monitoring, 外形監視とも)の2つのアプローチがあります。この2つは非常に補完的なもので、併用することが有用であり、両方とも必要不可欠であると考えるチームもあります。
  3. 最良のモニタリング戦略は、フロントエンドとバックエンドのソリューションを組み合わせたものです。この組み合わせにより、開発者はスタックのすべてのレイヤーを通じてデジタル顧客体験を向上させるための、包括的なフレームワークが使えるようになります。

フロントエンド・モニタリング: 何が違うのか、なぜ必要なのか

フロントエンドモニタリングは一般的に「クライアントサイドモニタリング」とも呼ばれるもので、サーバサイドアプリケーションやインフラストラクチャのモニタリングとは根本的に異なります。これは、サーバーがWebブラウザとエンドユーザーに情報を送信した後に何が起こるかを測定するものです。その結果、フロントエンドモニタリングの価値は、次のように実証されています:

  1. 顧客体験を理解する: デジタルビジネスにとって、顧客体験に関する疑問に答えを持つことが強力な道具になります。ユーザーはサイトにアクセスできているか?サイトの速度は十分か?サイトのすべての画面や部品は機能しているか?可用性を確保しつつ、パフォーマンスと機能性が保たれているか?サイトオーナーにとって、いずれも重要なテーマでしょう。
  2. ラボデータとフィールドデータの両方を収集する: 問題が起こったときに最初に遭遇するのか誰か?それは顧客です。フロントエンドモニタリングツールを使用することで、ステージング環境ではチームがパフォーマンスを計測して評価します。また、本番環境では幅広い顧客が様々なデバイスやネットワーク、ブラウザなどあらゆる環境からユーザー体験に関するリアルなデータを計測して評価することができます。
  3. 相互依存するテクノロジーを管理する: 最新のウェブサイトはとても複雑なコンポーネントで成り立っています。フレームワーク、API、画像、サードパーティのサービス、プラグイン、コンテンツプラットフォームなどの様々な動的な要素を駆使して、顧客体験を提供しています。企業にとって「製品の初出荷」の際には、地域やネットワーク、デバイスに関係なく、ユーザーを満足させるサイトを構築することが重要な仕事になります。フロントエンド・モニタリングは、何百ものリソース、APIコール、アプリケーション・トランザクションなどなどがサーバーからブラウザにプッシュされる状況で、「なにがどのように実行されているか」という問いに答えることができます。
  4. 顧客からのフィードバックで、デジタルビジネスを強化する: エンドユーザーの体験を計測することで、重要なテクノロジーやビジネス上の意思決定の関係が理解できるようになります。単純な可用性だけではなく、エンドユーザーのデータを活用して、チェックアウトや広告のクリック数などの重要なメトリクスと、サイトの速度との関係がわかるようになります。エンドユーザーデータの測定を推進することで、ウェブサイトの速度がビジネスへ与えている影響を定量化して理解し、管理できるようになります。

リアルユーザモニタリング vs 合成モニタリング

ウェブサイトのパフォーマンスを計測、通知、改善するための業界標準は2つあります。1つ目は、リアルユーザーモニタリング(RUM)と呼ばれ、実際にウェブサイトに訪れたユーザーの行動を計測・分析します。2つ目のアプローチは、合成モニタリングと呼ばれ、ウェブサイト上のユーザーのトラフィックを積極的にシミュレートすることで、データを収集するものです。

リアルユーザモニタリング: 受動的かつパワフル

リアルユーザーモニタリングは、その名の通り、ウェブサイトやウェブアプリケーションと実際のユーザーのインタラクションを測定します。これは一般的にパッシブ(受動的)・フロントエンド・モニタリングとも呼ばれています。このソリューションは、メトリクスを収集するために実際のユーザーのトラフィックを使います。

サイトオーナーは通常、サイトのページヘッダーに JavaScript のスニペットを配置することで、 RUMを実装します。ユーザーがページを訪問すると、このスクリプトはユーザーとその体験に関する様々な情報をキャプチャします。

  • タイミングまたはパフォーマンスの測定(一般的にはnavigation timing APIが使われます)
  • ウェブブラウザの種類とバージョン、OS、デバイスの種類、IPアドレスに基づく地理的位置情報など、エンドユーザーに関する多次元情報
  • エラー情報(JavaScriptのエラーなど)

一般的に、リアルユーザーのモニタリングは、サイト所有者がアプリケーションに関して意思決定を行う際に、様々な時間軸において効果を発揮します。

短期的な意思決定の例:

  • 最近のデプロイの影響で、パフォーマンスに問題が起こっている?
  • どのJSエラーを優先して修正すべき?
  • ブラウザやデバイスやアクセス回線が、ウェブサイトのパフォーマンスを悪化させる原因になっていないか?

長期的な意思決定の例:

  • 商品の購入につなげるためには、どの程度ページレンダリングの速度があればよいのか?
  • 離脱を減らすためのページデザインとは?
  • エンドユーザー体験のための組織「センターオブエクセレンス」を設立すべき?

合成モニタリング: オンラインの「保険」

RUMと比較して、合成モニタリングは「アクティブ(積極的)・モニタリング」とも呼ばれています。総合的なモニタリングは、顧客が気づく前にサイトの問題をプロアクティブに特定し、解決するのが理想です。合成モニタリングは、ユーザーのアクティビティをシミュレートし、シミュレートされたインタラクションの結果を追跡・分析することで、フロントエンドのパフォーマンスを測定します。

合成モニタリングソリューションは、重要なエンドポイント、ユーザー経路、および API の可用性、機能性、およびパフォーマンスを監視するための、信頼性が高く、予測可能で、一貫性の高いツールを提供します。

  • 可用性を監視する: 合成モニタリングは「サイトは稼働しているか」という質問に答えます。サイトがダウンしているとわかった場合は、何が影響しているのかのスコープを把握し、対策に取り掛かることになります。
  • ページの部品の機能性: サイト上のすべてのボタン、リンク、そしてインタラクティブな要素について、「このサイトは意図した通りに機能しているか?」という問いに応えます。合成モニタリングのシナリオを記述して、想定されるユーザーの主要な導線やクリック、インタラクションを定期的に巡回します。それにより、実際のユーザーが壊れた機能、欠落した機能、または誤ったラベルが貼られた機能に遭遇しないようにします。
  • ページパフォーマンス: 「どのくらいの速さなのか」という質問に答えます。最新の合成モニタリングソリューションは、一般的なユーザー経路にまたがって、全ページのロード時間や、すべてのページ資産やサードパーティのパフォーマンスなど、全ページのタイミング情報を返します。
  • 競合他社とのベンチマーク: 合成モニタリングは「競合他社はどのくらい速いのか」という質問にも答えることができます。多くの場合、企業はサイトの速度とパフォーマンスを最適化しようとしますが、現在のところページ速度を0秒にする方法はないため、パフォーマンス目標を設定するための健全な方法は、競合他社とサイト速度を比較することです。

全体論的モニタリング: 何かを選択するのではなく、全体の関連性を観測する

RUMと合成モニタリングの両方からエンドユーザー体験の洞察が得られます。どちらか一方だけに頼るのはあまり意味がありません。それよりも、両方のアプローチを使用して積極的に改善し、顧客とデジタルビジネスの価値を最大化することを学ぶことの方が重要です。

成功しているデジタルビジネスは、フロントエンド、バックエンド、サーバーサイドのモニタリングを組み合わせることによって価値(可用性の確保、顧客満足度の向上、収益の増加)が提供できています。バックエンドとインフラストラクチャが、どのようにウェブサイトの顧客体験に影響を与えるかを考えてみましょう。統合されたモニタリングツールや機能を使用することで、次のようなプロセスを簡単に実現できます。

  • アプリケーションのトランザクションとデータベース呼び出しを監視する: 利用者への影響が大きいものを優先して、アプリケーション・トランザクションやデータベース・コールのトラブルシューティングを行ったり、チューニングや最適化を行います。New Relic APMのTransactionsDatabasesを使ってボトルネックをトリアージして、全体的な応答性能とデジタル体験をチェックしましょう。
  • 同様のアプローチでインフラに焦点を当て、パフォーマンスの問題に対処する: フロントエンドのパフォーマンス問題の中には、インフラの障害やプロビジョニングの問題から始まっているものもあります。New Relic Infrastructureのようなツールでホストの応答性を監視し、応答性のないシステム、設定ミス、応答性の低いシステムに対してアラートを設定し、リスクを軽減させましょう。
  • バックエンドAPIとマイクロサービスの健全性を確保する: バックエンド API の中には、フロントエンドの機能において大きな役割を果たすものがあります。New Relic Synthetics API monitors をつかってAPIエンドポイントのボトルネックを特定し、可用性や期待どおりのパフォーマンスが保たれているかを確認しましょう。
  • サードパーティサービスのパフォーマンスをチェックする: データ授受、メール、メッセージング、コンテンツなどの機能を提供するサードパーティのサービスは便利です。しかし、これらのサービスはサードパーティのバックエンドに依存しているため、パフォーマンスの低下やクラッシュのリスクが高まるかもしれません。これも New Relic Synthetics API monitors を使うことで、サードパーティサービスを監視し、必要に応じてそれらのサービスを分離する判断が素早く下せるようになります。

素晴らしいデジタル顧客体験を提供しましょう

優れたデジタル顧客体験を提供するための重要な要素の一つは、包括的な統合モニタリング環境を活用することです。RUMと合成モニタリングのどちらが優れているか、フロントエンドとバックエンドのモニタリングのどちらに重点を置くべきか、そのような議論はあまり意味がありません。これらすべての観測データを集め、連携させ、顧客体験に役立つデータをチームが使える状態にすることが重要になります。