シナリオ計測・監視(Playwright/Puppeteer)
シナリオ計測・監視とは
ECサイトでの購入や、会員サービスへのログインは、1つのページでは完結しません。
利用者は、複数のページを順に移動しながら、目的の操作を終えます。
シナリオ計測・監視は、この典型的な操作の流れを Playwright または Puppeteer のスクリプトで再現し、ページ遷移全体を計測・監視する、合成監視(Synthetic Monitoring)の手法です。
ログインや商品の選択など、動的に変化するページも計測できるため、単ページの計測では届かない部分の品質を把握できます。
目的は、利用者が目的の操作を終えるまでの「流れ」を計測・監視することです。
どのページで時間がかかっているか、どこで操作が失敗しているかを、利用者と同じ回線から確かめられます。
具体例
ECサイトでの商品購入
ECサイトにおける「商品を購入する」という操作は、通常、以下の流れで完了します。
- トップページにアクセス
- 商品の検索
- 商品詳細の確認
- カートに商品を追加
- ログインまたはゲストチェックアウト
- 配送日時と配送先の指定
- 支払い方法の選択と決済
- 注文の確認と完了
在庫が安定していて変動が少ない商品を選んで計測するのが一般的です。
同じテンプレートで作られたページは表示の仕組みが共通なので、すべてのページを計測する必要はありません。
航空会社、鉄道会社、映画館、劇場、ホテル等でのオンライン予約
一般に、以下の流れで「チケットや部屋を予約する」という操作が完了します。
- トップページにアクセス
- 日程、目的地などの条件を設定して検索
- 希望する便、座席、部屋を選択
- ログイン、またはゲストとして進む
- 追加オプションを選択
- 決済方法を選び、支払いを完了
- 予約の確認と完了
時間帯によって空き状況が変わるため、選択肢を自動で選ぶようにスクリプトを組みます。
新聞社、雑誌社、オンラインメディアでの記事閲覧
一般に、以下の流れで「記事を読む」という操作が完了します。
- トップページにアクセス
- 最上位に表示されている記事をクリック
- ログインまたはサインイン
- 記事の残りの部分を閲覧
- 関連記事をクリックして表示
掲載される記事は頻繁に変わるため、「最上位に表示される記事」のように位置で指定してスクリプトを組みます。
スクリプトの作成
スクリプトは、次のどちらかのフレームワークで作成します。
- Microsoft Playwright
- Google Puppeteer
すでに Playwright や Puppeteer で E2E テストを書いている場合は、そのスクリプトを計測に生かせます。
スクリプトの設計と作成は、プロフェッショナルサービスで代行することもできます。
料金の考え方
シナリオ計測・監視では、1ページの表示ごとに1ポイントを消費します。
たとえば、5ページで構成されるシナリオを1回実行すると、5ポイントを消費します。
料金は、ページ数 × 計測拠点 × 回線 × 計測頻度で決まります。詳しくは価格をご覧ください。
長所・短所
長所
- ログインが必要なページなど、単ページの計測では到達できないページも計測できます。
- SPA(Single Page Application)にも対応しています。
- Cache-Control や Expires ヘッダー、Service Worker などによるキャッシュの効果を、ページ遷移後も評価できます。
- ページ遷移の途中での JavaScript の挙動も捉えられます。
- 利用者が終えたい操作の単位で時間を管理できるため、改善の優先順位を付けやすくなります。
短所
- ページ内の要素をセレクタで指定するため、class や id、DOM構造が変わるとスクリプトの更新が必要です。
- 途中のページでエラーが起きると、その後のページは計測されません。
- あらかじめ決めたシナリオしか計測できないため、新しい操作の流れには新しいスクリプトが必要です。
- ページ数に比例してポイントを消費するため、単ページの計測より費用がかかります。