web-dev-qa-db-ja.com

Chrome DevToolsでフルページサイズを測定

私はしばらくグーグル検索を行ってきましたが、これに対する明確な解決策は見つかりませんでした。

Webページ全体の重量/サイズ(すべてのドキュメント+スクリプト+フォント+スタイルなど)を測定したい。 devtoolsのネットワークタブにはサイズ/コンテンツがありますが、合計する必要があります(毎回合計するのではありません)。

Chrome.devtools。* APIを探していましたが、簡単なものは見つかりませんでした。

それを達成する方法はありますか?

22
Oskar Szura

[ネットワーク]タブで、[キャッシュを無効にする]がオンになっていることを確認してから、ページを読み込むときに、下部パネルで合計転送サイズを確認します。以下のスクリーンショットを参照してください。

Network Transfer

個々のサイズは丸められますが、下部の合計ではバイトサイズが使用されます。これは、HARで確認できます。合計は表示のために丸められます。個人の合計とDevToolsで表示される合計との間にわずかな不一致がある場合、それが理由です。

35
Gideon Pyzer