ウェブサイトのロード時間に不具合や遅延が発生すると、ユーザーはホラー映画を見ているときとほぼ同じストレスを感じることをご存知でしたか?これは、2016 Ericsson Mobility Reportにて発表されています。
私たちはVectra AIプラットフォームのUIを見直し、毎日UIを見るユーザーが操作する際に、ストレスを感じることなく満足感を得られるような製品を提供したいと考えました。理想を言えば、私たちのUIは瞬時にロードされることを目指したいところです。実際、Jacob Nielsen氏の2010年の記事「Website Response Times(ウェブサイトのレスポンスタイム)」では、ウェブページが0.1秒以内にロードされると、ユーザーは即応性を感じ、まるでコンピュータではなくユーザー自身が操作したかのように感じると説明しています。
もちろん完璧な状態は不可能ですが、ユーザーがUIのロードを待っている間にマウスのバッテリーが切れていないか確認したり、セカンドモニターで『Bridgerton』の最新シーズンを再生する必要を感じたりするような状況は避けたいと考えました。
最適なロード時間のための計画
Vectra AI Platformのユーザーインターフェースは、ユーザーが検知結果の確認、脅威の調査、攻撃への対応、データソースの設定、およびプラットフォームをビジネスに合わせてカスタマイズするための構成設定の管理に使用されます。プラットフォームがより多くの機能と大量のデータを提供できるよう進化し、また、より多くのクラウド利用事例に対応するにつれ、ユーザーからページのロード時間が長くなり、コアのワークフローの実行に遅延が生じているとの報告が寄せられるようになりました。以前は、ユーザーが10GBpsのイーサネットケーブルで当社のアプライアンスに直接接続している場合、Vectra AIは非常に高速でしたが、わずかな非効率性でもオンラインでは蓄積されていきます。
よりスムーズで高速なユーザー体験の実現が急務であることを認識し、当社アプリケーションのパフォーマンスを全面的に見直す大規模な取り組みに着手しました。主な目的は以下の通りです。
- 許容可能なサービスレベル目標（SLO）にチームとして合意する
- コアワークフローのページロードとユーザーアクションのメトリクスの取得と追跡を開始する
- すべてのコアワークフローページについて、ページロードとユーザーアクションのメトリクスを合意されたSLO値まで減少させるよう取り組む
- これらの評価指標を継続的に監視するプロセスを設定し、いずれかの評価指標が合意されたSLOを満たしていない場合に警告を発し、あらゆる問題に迅速に対処できるようにする
これらの野心的な目標を設定することで、現在の問題点に対処するだけでなく、プラットフォームの拡張や新機能の追加を継続する中で、潜在的なパフォーマンスのボトルネックに対するアプリケーションの将来性を確保することを目指しました。
プロジェクト達成のための実験的アプローチ
最初に行動に移したことのひとつは、プロジェクト管理チームと協力してサービスレベル目標 (SLO) を定義することでした。パフォーマンス改善の明確な測定可能な目標を設定するには、これらのSLOが不可欠でした。ページのロードパフォーマンスを測定する Largest Contentful Paint (LCP) や、ユーザーのインタラクティブ性を測定する Interaction to Next Paint (INP) などの主要な測定基準に焦点を当てました。
これらのメトリクスの詳細については、web.devをご確認ください。
しかし、これらのSLOに合意する前に、Vectra AIが競合他社に対してどのようなパフォーマンスを示すのかを把握したいと考え、アドホックテストを実施しました。CLSとINPについては、レイアウトのずれがなくロード後に即座にフィードバックが返されることを期待し、主観的な評価で確認しました。LCPについては、実績のあるストップウォッチ方式を採用しました。（幸いにも私はすでにストップウォッチを持っていたので、経理部にストップウォッチ購入の申請をする必要はありませんでした！）
方法は簡単です。
まず、時計をスタートさせ、3秒になったのを見てからストップを押しました。これが私の人間的な反応の遅れで、300ミリ秒という鋭い反応でした。(ここでごまかすのは簡単なので、ミリ秒カウンターを隠すか、さもなければ時間を先読みすることになる) 各ページで、3からカウントし、リンクをクリックすると同時に時計をスタートさせ、重要なコンテンツがロードされたら時計をストップします。お客様の反応時間を差し引いた時間が、ページのロードにかかった時間となります。
当社のアドホックテストでは、UIの操作やロード時間の「遅さ」について、お客様がおっしゃる通りであることが確認されました。しかし、他のサイバーセキュリティベンダーや他のベストインクラスのSaaS製品と比較すると、当社のロード時間は実際には同程度でした。しかし、ここで自問しなければならなかったのは、同じままで良いのか、それともロード時間を改善しようと努力するのか、という点でした。
Vectra AIプラットフォームをさらに改善する方法
当社のエンジニアリング、製品管理、UX/UIチームの共同作業により、以下の点が改善され、より応答性と信頼性の高いアプリケーションと なりました。
- "スケルトン・スクリーン"によるページ読み込みパフォーマンスの知覚
- APIリクエストとバックエンド操作のパフォーマンス
- Vectra AIプラットフォームのページロード時間
- ユーザー・ログイン・エクスペリエンスの効率化
ページのロード時間やAPIのレスポンスタイムなどの主要な指標は大幅に改善され、ユーザーの満足度とエンゲージメントの向上に直接つながりました。フロントエンドとバックエンドの両方のコンポーネントの最適化に重点的に取り組んだことで、当社のプラットフォームは大量のデータと複雑なユーザー操作をより適切に処理できるようになりました。
当社のUIパフォーマンスプロジェクトの詳細については、こちらのホワイトペーパーでご確認ください。