sitespeed.io coach の chrome plugin の使い方

sitespeed.io の Coach には、CLI ツールだけでなく、Chorme の plugin もあります。

Coach Panel - Chrome Web Store

インストールはしていたのですが、動かし方がわからずしばらく放置していました。aXe の動作確認中に、芋づるで使い方がわかったので、使い方を記載します。

---

起動方法

1. Coach Panel - Chrome Web Store を Chrome plugin を追加します。

2. Chrome の 開発者ツールを起動します。

3. 開発者ツールのメニューの右側にCoach タブが追加されるのでタブをクリックします¹

4. Alalyse ボタンを押すとチェックが走ります。
   

5. ボタン押すと、すぐにチェック結果が出力されます。CLIツールだと画面を一度表示するので、時間がかかりますが、おそらく開いている画面に対して、チェックを実施するので、早いのかと思います。
   ReAlayze を押すと、チェックが再度実施されます。
   

---

使ってみた感想

機能的には、 CLI ツールよりはお手軽に使えるので開発時のセルフチェック用途使用するのが良いかと思います。
Chromeの開発者ツールの Audit もあり、機能的にはこちらのほうがすごいですが、チェックに時間がかかるのと、Timing API の結果を収集する等、Coach 独自の指標もあるので、併用が良いです。²

以上です。