自分のサイト内に存在する要素すべての読み込み速度の確認方法(Android)

自分のサイトの読み込み速度が遅くなってしまったとき、どのファイルが読み込み速度を遅くしているのか気になったことはないでしょうか?

この記事では、スマホでもどのファイルが読み込み速度を遅くしているのか確認できる方法をご紹介していますので是非ご覧下さい。

どんなふうに確認?

以下が確認画面です。細かい操作方法は後述いたしますが、スマホ(Android)で開いたときに、以下のファイルの読み込み速度が表示されているのがわかると思います。

PCでは読み込み速度は速いけど、スマホでの読み込み速度が遅い場合に使えそうですね。

概要にて確認したい内容が映し出されているようでしたら、実際にアプリをインストールして、自分のスマホでも同じように見ることができるか確認してみましょう。

まず、以下のDroid Web Inspectorをインストールしてください。Android版のみなので注意。

Droid Web Inspector

Invoate, LLC無料posted withアプリーチ

Droid Web Inspectorを開くと、URLの入力画面があります。

このURL入力部分は、履歴が残せない仕様なので、都度入力しなければならないです。

自分の閲覧したいサイトURLを入力して実行してみてください。

『Finish Loading』とメッセージが表示されれば読み込み成功です。

しばらくすると、スマホ画面の下の方に、『Consoleオブジェクト』が表示されます。パソコンでF12キーを押しても出てきます。そのため、F12開発者ツールなんて呼ばれることもあります。

コンソールが表示されましたら、『Network』タブをクリックしてみて下さい。

すると、各ファイルの読み込み速度及びファイルごとの読み込み優先度がマンマシンチャート形式で表示されます。