8
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

新しいパフォーマンス指標のINPをChrome UXレポートで見れるように設定する

Last updated at Posted at 2022-06-15

先月Googleが新たに発表したパフォーマンスの指標である、Interaction to Next Paint (INP)をChrome UXレポートのダッシュボードに追加する方法について説明します。

Chrome UXレポートやパフォーマンスを継続的に計測する方法などについてはこちらの記事で説明していますので、ご覧ください。

Interaction to Next Paint (INP) とは

INPとは、Experimentalとして発表された指標で、サイトの応答性を表します。

Interaction to Next Paint (INP) is an experimental field metric that assesses responsiveness.

応答性に関する指標としてFIDが存在しますが、FIDは最初の入力に対する応答性を計測するのに対して、INPはすべての応答性を計測します。
詳しい違いはこちらにあります。

また、Google I/Oにて動画で説明もされています。

まだExperimentalなので、今後についての詳細は発表されていなかったり、水準は変更される可能性はあるようです。

INPの計測方法

INPはすでに色々なツールで計測できるようになっています。
今回はもともと使っていた、Chrome UXレポートのダッシュボードに追加してみます。

Chrome UX Reportへの追加

現時点ではまだExperimentalなので、変更される可能性があります

INPのデータは自動で取得されており、データソースへ追加して、ダッシュボードに追加することで見れるようになります。
最初にデータソースを選択します。

image.png

表示するだけだと存在しないので、左下のフィールドを更新を押します。

image.png

すると、これらのフィールドが追加されます。

image.png

追加されたフィールドと、それぞれの説明はこちらです。

フィールド 説明
Normalized Good INP The percent of Interaction to Next Paint experiences < 200 milliseconds. Normalized per device.
Normalized NI INP The percent of Interaction to Next Paint experiences >= 200 milliseconds and < 500 milliseconds. Normalized per device.
Normalized Poor INP The percent of Interaction to Next Paint experiences >= 500 milliseconds. Normalized per device.
Good INP The percent of Interaction to Next Paint experiences < 200 milliseconds.
NI INP The percent of Interaction to Next Paint experiences >= 200 milliseconds and < 500 milliseconds.
Poor INP The percent of Interaction to Next Paint experiences >= 500 milliseconds.
P75 INP The 75th percentile of Interaction to Next Paint experiences.
P75 INP (All Devices) The 75th percentile of Interaction to Next Paint experiences for all devices.

これで、データポータルのレポートに追加することができます。

他のレポートをベースにして編集することで、このようにレポートを作成することができます。

image.png

参考

8
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
8
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?