Google ドライブのホスト機能が使えなくなったの投稿で、遅いと思われるが、調べてみる必要がある旨を書きましたので、今回、Blogger から GDrive のファイルを Host する場合の速度について検証してみました。
Google ドライブのホスト機能は 2015年8月31日 に廃止されましたが直リンは可能です。
画像の多いアーカイブのページをGTmetrixで計測
画面の表示時間にはっきり影響が見られるくらい突出して足を引っ張っています。割とサイズの近いものや、より大きいものとのみ比較しても確実に遅い。
これは一番最初に測定した結果ですが、何度か試して見ると、これほど遅くはないという結果もあって、ばらつきがみられました。
下は比較的速かった結果。キャッシュは外部サイトからのアクセスなので、関係ないとは思いますが、一応削除して計測しました。
Picasa ウェブ アルバムと Google Drive の比較
今度は、同じ投稿内に大きめの同じ Jpeg ファイルを、Picasa Web Albums と GDrive から貼り付けた比較です。
ブロガー以外から呼び出した結果
こちらも、バラツキがありましたが、Picasa とも差が付いているのがわかります。
Picasa ウェブ アルバムは Google フォトに変更されましたが直リンは可能です。
キャッシュがあるなしの比較
キャッシュが効いている場合はどうなるかを、Firebug で測定。
データが揃いませんでしたが、大体これくらいの数値。
劇的に速くなっているものの、 データ受信0で 304 Not Modified の返事をもらうだけにしては、時間が掛かりすぎていると思います。
SVG のデータを HTMLに埋め込んだ場合との比較
ページを移動するとインラインではデータの再取得が必要、Google ドライブに置いた場合はキャッシュが効きます。
ページが異なるので、比較用に同じコンテンツのみを一部抽出。
ページを表示
ページを移動
サイズが増える、キャッシュが効かない不利を背負ってでも、インラインに埋め込んだほうが速い。
このブログは、検索からのアクセスがほとんどなのに対して、同じカテゴリーのサイト(free.)は、同じかたが何十回とクリックしてくれます。そのようなサイトで、しかももっと巨大な共通ファイルを使う場合は、もしかしたらメリットがあるかもしれません。だだ、その場合でも、どちらを選択するかと言われればインラインに記述すると思います。
Google Drive からの直リンクで SVG を埋め込んだサイト内ページ
表示の遅さを確認できます。
Google ドライブ その他の検証
http://googledrive.com/host/ へ接続して改善を試みるも、https://googledrive.com/host/ へリダイレクトされてしまい不可。
Google site においた場合も、同じサーバーを使ってるようにそっくりな結果でした。
検証されているサイトを見つけましたので、そちらも参考にさせてもらいました。
BLOGGER ITEMS さん
Blogger host and direct embedded CSS / Javascript comparison
JavaScript と CSS をインラインと GDrive に外部データとして置いた場合の、ページ表示の速度を比較されています。
内容の上の方は、host機能の使い方なので飛ばしてもらって、下の方の、Comparing host and direct embedded code speed のところになります。
上の図が、Google Drive にファイルを置いた場合。下が HTML 内に記述したの場合の PageSpeed Insights の結果です。
| Google Drive | 47/100 |
| テンプレート内 | 84/100 |
個々のデータについては、触れられていませんが、ここまで差が付くと、そこまで検証するまでもなく結論は明らかと思います。
貼り付け画像は表示の遅れが見て取れますが、CSS や JavaScript の場合は、おそらく「ズ～～～」（なにも表示されない時間）→「パッ」（レンダリングは一瞬）となるはずです。
結びの内容と同じ意見なので、引用させてもらいます。
結論
Google Drive に CSS や JavaScript を外部ファイルとして置くような使い方は決してすべきでない。
Blogger の Template Code に記述できないもののみに利用すべきだ。例えば、flash や動画など…