
すいません。
初めにあやまっときます。Facebook が悪い訳じゃないんです。ただ、Facebook の「いいね」ボタンとかを外したら、このブログの表示がそれなりに速くなってしまったもので。。
というわけで、Facebook の「いいね」ボタンとかを外したらこのブログの表示時間が短くなったよ、という話。
きっかけ
なんだかこのブログももっさりだなぁと感じていまして、どうしたものかと思っておりました。
っで、何が遅いんだろうと思って、Google の Chrome Developer Tools で見てみたら、リクエスト数がもれなく 200を超えている。
関連記事:Google の Chrome Developer Tools で WEB ページのリクエスト数を確認してみた
初めは 200 のリクエスト数が多いのか少ないのか解らなかったけど、いろんなブログを Chrome Developer Tools で見てみると、あんまりもっさり感を感じないのは、概ね 100 くらいまで。
もちろんリクエスト数だけでもっさり感が出るわけじゃないけど今のままじゃなんかヤダ。なにせ 200 だし。2倍だし。
という訳で、何もわからない私は、CSS とか Javascript をひとつのファイルにまとめてみようかなぁとか考えたわけですが、所詮 CSS や Javascript のファイルは合計で 20 ファイルにも満たない。
手間暇かけて、さらに今後のメンテナンス性を犠牲にしてまで、ファイルを結合するのはいかがなものか。
はてさてどうしよう。
じっくり Chrome Developer Tools を眺めてみた
どうしたものかと、今まであんまり意味がわからずほとんど見ていなかった Chrome Developer Tools のタイムラインを眺めてみたら、どうやらアクセスに時間が掛かっているのは Facebook 関連のファイルっぽい。
確かに、「いいね」ボタンは遅いっていう話は良く聞くし、実際「いいね」ボタンがなかなか表示されないことも多い。
ってことで「いいね」ボタンを外してみた。ゴメン。
あら??
イマイチ変化なし。
うーん、と悩むこと3分。
「いいね」ボタンを設置するためには、<body> タグ直下に、なにやらスクリプトを設置したような記憶が・・。
ということで、<body> 直下に設置したスクリプトを削除してみたら・・・ビンゴ!
プロセス数は一気に 80 くらい減って、さらにページの表示時間も 0.5~0.8秒ほど短縮された。実際、体感的にも速く感じる。
おー、すごい。でも、ごめん。
あれれれれ??
喜びも束の間、Facebook コメントが表示されなくなっていることに気付いた。
そりゃそうだ。<body> 直下のスクリプトを設置した上で、「いいね」ボタンやら Facebook コメントなどは機能するので、スクリプトを削除したから Facebook コメント欄も表示されない。
うーん。まいった。
どうしよ
80 のリクエスト数減 + 0.5~0.8秒の表示速度短縮と、「いいね」ボタン & Facebook コメントのどちらをとるか?
ごめん。
80 のリクエスト数減 + 0.5~0.8秒の表示速度短縮をとった。
とりあえず「いいね」ボタンは 「シェア」ボタンで代替して、Facebook コメントがなくなっても WordPress のコメント機能で代替できるし。ってかそもそもコメント付かないし・・(泣)。
関連記事:Facebook の「シェア」ボタンを復活させる方法
という訳で、「いいね」ボタン & Facebook コメント欄と引き換えに、80 のリクエスト数減と0.5~0.8秒程度の高速化が計れました。
めでたしめでたし。だけど、ゴメン、ね。
でわでわ。