Session Replay

概要

セッションリプレイは、ユーザーのウェブブラウジング体験をキャプチャして視覚的に再生できるようにすることで、ユーザーエクスペリエンスモニタリングを拡張します。セッションリプレイを RUM パフォーマンスデータと組み合わせると、エラーの識別、再現、解決に有益で、ウェブアプリケーションの使用パターンと設計上の落とし穴に対する洞察をもたらすこともできます。

RUM ブラウザ SDK はオープンソースであり、オープンソースの rrweb プロジェクトを活用したものです。

セッションリプレイレコーダー

セッションリプレイレコーダーは、RUM ブラウザ SDK の一部です。このレコーダーは、Web ページで発生したイベント (DOM の変更、マウスの移動、クリック、入力イベントなど) を、これらのイベントのタイムスタンプとともに追跡して記録することにより、ブラウザの DOM と CSS のスナップショットを取得します。

その後、Datadog は Web ページを再構築し、記録されたイベントをリプレイビューの適切なタイミングで再適用します。セッションリプレイは、通常の RUM セッションと同じ 30 日間の保持ポリシーに従います。

セッションリプレイレコーダーは、IE11 を除き、RUM ブラウザ SDK でサポートされているすべてのブラウザをサポートしています。詳しくは、ブラウザサポートテーブルを参照してください。

セッションリプレイのネットワークへの影響を軽減し、セッションリプレイレコーダーがアプリケーションのパフォーマンスに与えるオーバーヘッドを最小限に抑えるため、Datadog はデータを送信する前に圧縮を行います。また、Datadog は CPU に負荷のかかる作業 (圧縮など) のほとんどをバックグラウンドのサービスワーカーに委ねることで、ブラウザの UI スレッドの負荷を軽減しています。ネットワーク帯域幅への影響は 100kB/分未満と予想されます。

セットアップ

セッションリプレイは、RUM ブラウザ SDK で利用できます。セッションリプレイのデータ収集を開始するには、RUM アプリケーションの作成、クライアントトークン生成、RUM ブラウザ SDK の初期化により、Datadog RUM ブラウザモニタリングをセットアップしてください。

セッションリプレイを有効にする

選択したインストール方法に応じて、npm パッケージ名または CDN URL を変更します。

npm

@datadog/browser-rum パッケージを @datadog/browser-rum のバージョン >3.6.0 に置き換えます。記録を開始するには、datadogRum.startSessionReplayRecording() を呼び出します。

import { datadogRum } from '@datadog/browser-rum';

datadogRum.init({
    applicationId: '<DATADOG_APPLICATION_ID>',
    clientToken: '<DATADOG_CLIENT_TOKEN>',
    site: '<DATADOG_SITE>',
    //  service: 'my-web-application',
    //  env: 'production',
    //  version: '1.0.0',
    sampleRate: 100,
    sessionReplaySampleRate: 100,
    trackResources: true,
    trackLongTasks: true,
    trackInteractions: true
});

datadogRum.startSessionReplayRecording();

CDN

RUM ブラウザ SDK URL https://www.datadoghq-browser-agent.com/datadog-rum.js を https://www.datadoghq-browser-agent.com/datadog-rum-v4.js に置き換えます。DD_RUM.init() が呼び出されると、DD_RUM.startSessionReplayRecording() も呼び出されるまで、セッションリプレイの記録は開始されません。

コンフィギュレーション

RUM ブラウザ SDK の初期化パラメーターを使用することができます。

init() を呼び出しても、セッションリプレイは自動的に記録を開始しません。記録を開始するには、startSessionReplayRecording() を呼び出します。これは、条件付きで記録を開始する場合に役立ちます。たとえば、認証されたユーザーセッションのみを記録する場合などです。

if (user.isAuthenticated) {
    DD_RUM.startSessionReplayRecording();
}

セッションリプレイの記録を停止するには、stopSessionReplayRecording() を呼び出してください。

セッションリプレイを無効にする

セッションの記録を停止するには、startSessionReplayRecording() を削除し、sessionReplaySampleRate を 0 に設定します。これにより、リプレイを含む Browser RUM & セッションリプレイプランのデータ収集が停止します。

これらの構成を適用するには、RUM ブラウザ SDK をバージョン 3.6 以降にアップグレードしてください。

その他の参考資料

お役に立つドキュメント、リンクや記事:

Datadog Session Replay を使用してユーザージャーニーをリアルタイムで表示ブログ more more ファネル分析により、主要なユーザーフローを理解し、最適化するブログ more more RUM データを Explorer で確認ドキュメント more more