Feat/use inp

[keiya01]

INP(Interaction to Next Paint)の計測スクリプトを追加しました。

INPはFIDを拡張したもので、click, keypressなどのeventが発生してから次のpaint処理が走るまでの時間を計測します。
ユーザーのインタラクションから次のframeが表示されるまでに以下のように時間が計測されます。

• The input delay, which is the time between when the user interacts with the page, and when event handlers execute.
• The processing time, which is the total amount of time it takes to execute code in associated event handlers.
• The presentation delay, which is the time between when event handlers have finished executing, and when the browser presents the next frame.

指標は以下のようになっています。

Good	Needs Improvement	Poor
~ 200ms	200ms ~ 500ms	500ms ~

web-vitalsライブラリではINPに閾値を設定できて、defaultでは40ms以下はデータを取得しないようになっています。

詳細は https://web.dev/inp/ を確認してください。

INPはまだexperimentalな仕様なので今後変わる可能性があります。
そのためstableリリースではなく、npm version prerelease --preid=betaとしてリリースします。

[herablog]

INP以外も on* にしておいた方が良かったりするかな!?
https://github.com/GoogleChrome/web-vitals/tree/next

[keiya01]

これまだnextなので悩み中ですw
stableに入ってからでも良いかなと思ったりしてます

[herablog]

今読み込んでる3.0.0-beta.2はnextと同等 (versionsタブを参照)なのでbetaとして出すなら揃えちゃっていいかもなぁ。

まあどっちでも読んでも中身は一緒なんですがｗ
https://github.com/GoogleChrome/web-vitals/blob/next/src/deprecated.ts

[keiya01]

f1175e0
揃えました！

[herablog]