Home Blogs リアルタイムのCore Web VitalsとRUM分析が実現
Applications

リアルタイムのCore Web VitalsとRUM分析が実現

About The Author

Outline

コアWebバイタルは、Webページの高速性、応答性、視覚的安定性を理解するのに役立つ測定可能な指標ポイントのユニークなセットである。 メトリックポイントは、ウェブ上で優れた開発者体験を構築し、実際のユーザーがどのようにウェブアプリケーションを使用しているかを示すための優れたポイントであるが、ユーザーがそれらに戻るかどうかに劇的な影響を与える可能性がある。

Layer0(現在のEdgio)上のWebサイトのコアWebバイタルを理解するのに役立つ製品アップデートをいくつか行った。

機能

リアルタイムのCore Web VitalsとRUM分析

リアルタイムのCore Web VitalsとRUM分析

GoogleのCore Web VitalsがSEOランクに影響を与え始めるのはわずか2か月であり、リアルタイムCore Web VitalsとRUM Analyticsは正式にベータ版を終了した。 Layer0 Analyticsを使用すると、最大Contentful Paint (LCP)、Cumulative Layout Shift (CLS)、First Input Delay (FID)、Time to First Byte (TTFB)など、重要なパフォーマンスメトリックの傾向と分布を簡単に追跡できる。 さらに、Layer0のエッジベースのスプリットテストを使用して、Google Search ConsoleやPage Speed Insightsで数日または数週間待つのではなく、数分で変更の影響を確認できる。

これらの分析を利用するために、サイトをLayer0でホストする必要はない。 スクリプトタグだけでお前のものだ ここにあるドキュメントに従って開始する。

Core Web Vitals用のスプリットテストバリアント

Core Web Vitals用のスプリットテストバリアント

Layer0のEdgeベースのスプリットテストはCore Web Vitals Analyticsに統合され、チームはパフォーマンス最適化がCore Web Vitalsに与える影響を他のツールよりも迅速かつ正確にA/Bテストできるようになった。 スプリットテストバリアントに加えて、ブラウザ、キャッシュヒット、接続、国、デバイスタイプ、ページラベルによるパフォーマンスの簡単でわかりやすい内訳もある。

コアWebバイタルサインのインクリメンタルレイアウトシフト

コアWebバイタルサインのインクリメンタルレイアウトシフト

React、Angular、VueのCore Web Vitalsとシングルページアプリケーション(SPA)の問題についてブログを書いた。 これらの問題をより適切にトリアージするために、SPAのCLSを追跡および改善するのに役立つIncremental Layout Shiftと呼ばれる新しいメトリックを導入した。

Core Web Vitalsのページビュー

Core Web Vitalsのページビュー

Core Web Vitalsメトリクスは、サイトのユーザーエクスペリエンスを向上させる方法を理解するのに役立つ。 これらの指標は、サイトが変更されるにつれて時間の経過とともに必要になる。 ページビューとRUMイベントを経時的に表示する新しいグラフを追加したので、先週何が起こったのか、その修正方法、数か月前にうまく行っていたこと、潜在的なCore Web Vitalsの脅威に対処する方法を知ることができる。

RUMのフィルタリングエクスペリエンスが向上

RUMのフィルタリングエクスペリエンスが向上

情報は膨大であり、データは稀である。 開発者コンソールに情報が表示される可能性があるが、特定のパス、デバイス、ブラウザ、国などでフィルタリングすることで、Real User Metricsにドリルダウンできるようにした。 ノイズから独自のコンテキスト信号を作成して、可能な限りフィルタリングできる。

プラットフォーム全体でタイムゾーンをカスタマイズする

プラットフォーム全体でタイムゾーンをカスタマイズする

パンデミックが2020年に私たちに教えてくれたことは、リモートワークはもはや特権ではないということだ。 また、チームがタイムゾーンに分散しているため、プラットフォーム全体での時間の表示方法を理解し、カスタマイズしやすくなった。 開発者の生産性を向上させる間、それは1つのより少ない事である。

ダークモードで作業する

ダークモードで作業する 最近では、ダークモードはデバイスやソフトウェアの使用方法の中核部分であり、単なる機能から必要な機能への前例のない移行が行われている。 開発者コンソールにダークモードを追加し、目の疲れを軽減し、バッテリー寿命を改善し、ログインして作業を完了することを選択したときはいつでも生産性を向上させるなどの利点を提供した。 コンソールに移動する

チュートリアル

コアウェブバイタルを測定する

2021年5月時点で、GoogleはCore Web Vitalsと呼ばれる一連の指標に基づいてウェブサイトをランク付けする。 サイトのパフォーマンスを測定する際にXDNがどのように役立つかを学ぶ。

リソース

最速のeコマーススタックを構築する方法:フロントエンド、CDN、eコマースプラットフォーム フロントエンド、CDN、eコマースプラットフォームのインサイトなど、eコマースサイトの最速テクノロジースタックを構築するための包括的なガイドを入手する。 Nuxtの未来 フロントエンドとフルスタックの開発者向けのポッドキャストであるJavaScript Jamのエピソードを、セバスチャン・ショパンとの会話のために聴き取ってみよう。 Nuxt.jsの作成者とCTOは、フレームワークのサーバーレスサポート、静的サイト生成、Nuxt 3の機能の詳細を共有している。