2023年8月にリリースされたLighthouseのメジャーバージョン、11について内容を確認していきます。
Lighthouse 11ではAccessibilityのカテゴリーの追加、INPの計測に関する変更、Legacy navigationの削除などの変更がありました。
Chromeのdevtoolで試したい場合、Chrome 118で取り込まれる予定ですが、Chrome Canaryではすでに利用可能です。
Accessibility
v10 → v11で、13のauditsが追加されました。
個人的にちゃんと見れていなかったのですが、マイナーバージョンアップで都度いくつか追加されていたようです。
- aria-allowed-role
- aria-dialog-name
- aria-text
- html-xml-lang-mismatch
- image-redundant-alt
- input-button-name
- label-content-name-mismatch
- link-in-text-block
- select-name
- skip-link
- table–duplicate-name
- table-fake-caption
- td-has-header
これに伴い重み付けも変更されています。
Accessibility の Manual audit について
Accessibilityにはスコア化されない Manual audit というものがあります。(今まで見逃していました)
これらはLighthouseで自動的にテストできないものなのでスコア化されていないですが、チェックした方がいいリストになっています。
Accessibilityスコアが100だったときにこの Manual Check が優先して表示されるようになりました。
(画像はWhat's new in Lighthouse 11から引用)
INPの変更について
2024年3月にCore Web Vitalsとなる予定のINPですが、Lighthouseからexperimentalの表記がなくなりました。
keyが変わるので、計測している場合は対応が必要となります。
@@ -120,4 +120,4 @@
},
- "experimental-interaction-to-next-paint": {
- "id": "experimental-interaction-to-next-paint",
+ "interaction-to-next-paint": {
+ "id": "interaction-to-next-paint",
"title": "Interaction to Next Paint",
\ No newline at end of file
INPはLighthouseのUser flow計測をすることができます。
CrUXでINPを確認する方法に関しては過去に記事を書いているので、詳しくはこちらをご覧ください。
Legacy navigationの変更について
Legacy navigationに関するフラグ等が完全に削除されました。
Legacy navigationにはページの読み込み方法をコントロールするオプション等があったのですが、今後はuser flowを使うことを検討する必要があります。
その他
その他の変更はReleaseをご確認ください。