メモ:極めろ!!Google Chrome Devtools 52の関節技

極めろ!!Google Chrome Devtools 52の関節技 - Qiita
こういうの好きなのでついつい見てしまいます。

結構知らないのがあり、勉強になりました。

30.リソース依存関係を表示
①shiftを押しながらリソース名をhoverする


33.各リソースを読み込みにかかった時間順に並び替え
①列見出し上で右クリック
②WaterfallのTotal Durationをクリック


35.ファイルサイズを指定してフィルタリング
①Filterボタンをクリック
②表示されてテキストボックスにlarger-than:10kと入力


44.フルスクリーンショットをとる
①cmd + shift + pで入力フォームを表示
②Capture fullと入力


45.コンポーネントのキャプチャーをとる
①DOM要素を選択
②cmd + shift + pで入力フォームを表示
③Capture nodeと入力

See Also

Chrome Devloper Tools の便利機能 - rochefort's blog