本ブログは 「Browser monitoring, refreshed」の抄訳となります。
小規模なオンラインビジネスを管理している場合でも、Jamstackを使用してウェブアプリケーションをより大規模に拡大しようとしている場合でも、素晴らしいデジタル顧客体験を提供したり、ユーザーが直面しているあらゆる問題の根本を素早く見つけたりするためには、簡単にアクセスできてすぐに使用できるメトリクスが必要です。New Relic Browser Monitoringは、フロントエンド、フルスタック、ウェブの開発者がアプリケーションのパフォーマンスやエンドユーザーの応答性を測定して改善することを支援するオールインワンソリューションです。
Browser Monitoringには、新機能がいくつか追加されており、トラブルシュートやフロントエンドアプリケーションの最適化が容易になりました。更新内容をご確認ください:
業界標準の GoogleのWeb Vitalsを中心に
Browser Monitoringのユーザーインタフェースには、GoogleのCore Web Vitalsがはじめから搭載されているため、カスタムダッシュボードを構築する必要がなく、重要なメトリクスを一目で確認することができます。
Google Web Vitalsは業界標準のメトリクスであり、ウェブアプリケーションのロードパフォーマンスや応答性、レイアウトの安定性を分析することができます。Core Web Vitalsはすべてのウェブページに適用されるWeb Vitalsのサブセットです。
アプリケーションのLargest Contentful Paint (最大視覚コンテンツの表示時間、LCP)、First Input Delay (初回入力までの遅延時間、FID)、Cumulative Layout Shift (累積レイアウト シフト数、CLS)をすぐに可視化して分析できるようになりました。サイトに予期せぬ遅延やクラッシュが発生した場合には、コンテキストスイッチを行わずに、フロントエンドのエンジニアが問題を発見して深く掘り下げることができます。
ページの可用性を高く保つには注視が必要であると当社は考えています。New RelicのUIにネイティブで組み込まれている関連インサイトやシグナルを利用することで、平均復旧時間(MTTR)の短縮や主要指標の状況把握が簡単に行なえます。
Web Vitalsの新しいBrowser Monitoringでは、パフォーマンスが最も高いページと最も低いページをすぐに把握することができます。そのため、正しいコンテキストを把握して障害発生時の平均検出時間(MTTD)を最小限に抑えることが可能です。お気に入り登録や、パフォーマンスが最も高い、あるいは低いサイトを詳しく確認することができます。また、業務に合わせて各Web Vitalで絞り込むことも可能です。
デバイス間のユーザートラフィックの表示
これに加えて、デスクトップ、モバイル、タブレットという3つのデバイスの種類ごとにフィルタリングしたフロントエンドトラフィックを表示できるようになりました。Web Vitalsやその他のメトリクスでフィルタリングすることで、この結果をさらに詳細に絞り込むこともできます。
この機能では非常に詳細なデータを分析できるため、デバッグをしたりフロントエンド体験を最適化するときに特に便利です。例えば、アプリケーションにデスクトップでアクセスする際に、FirefoxとChromeのどちらのページロードタイムが遅いかを確認することができます。コーディングすることなく正確に情報を得ることができるため、発見や解決にかかる時間を大幅に削減することができます。
この折れ線グラフには、FID(初回入力までの遅延時間)のパフォーマンスが最も低いものが、デバイスの種類、OS、国の指標とともに時系列で表示されています。そのため、何が問題なのか、またなぜ問題になっているのかを関連付けることができます。
また、アプリケーションのユーザー層が特定の2つ3つの地域から流入しているのであれば、これらの地域をお気に入りに追加することができます。こうすることで、ログインする度に主要な地域を参照することができます。
地域ごとのウェブトラフィックのフィルタリング
Browser Monitoring内にはgeographyのページがあり、直感的なマップによってフロントエンド体験の重要なインサイトに的を絞るのに役立ちます。このマップには地域ごとのユーザーデータを表示することができ、トラフィックやエラーが発生しやすい場所をデバイスの種類の情報とともに可視化することができます。例えば、どの地域でページロードタイムが通常よりも遅くなっているかが不明確な場合には、地理をフィルタリングすることで問題の根本を掘り下げやすくなります。
これらの新機能により、ウェブページの問題を迅速に検知することができるので、素早いスケーリングが優先事項となるダイナミックな環境において非常に有用です。
当社は、お客様にとって実際のユーザーのモニタリングがいかに重要であるかを理解しています。そのため、当社のフロントエンドのモニタリング機能すべてにおいて、新たな機能を継続して開発・提供しております。今後、さらなるお知らせを予定しております。楽しみにお待ちください。また、Futurestack 2022の基調講演を記録したこちらをぜひご視聴ください。
Next steps
無料のNew Relicアカウントを登録して、Browser Monitoringをはじめましょう。無料アカウントには、毎月100GBの無料のデータ取込み、1名のフルプラットフォームユーザー、および無制限の無料ベーシックユーザーが含まれます。
The views expressed on this blog are those of the author and do not necessarily reflect the views of New Relic. Any solutions offered by the author are environment-specific and not part of the commercial solutions or support offered by New Relic. Please join us exclusively at the Explorers Hub (discuss.newrelic.com) for questions and support related to this blog post. This blog may contain links to content on third-party sites. By providing such links, New Relic does not adopt, guarantee, approve or endorse the information, views or products available on such sites.
このブログに記載されている価格は、ブログ公開時の価格であることにご注意ください。価格が異なる場合や、更新されている場合があります。