読者です 読者をやめる 読者になる 読者になる

はてなブログの表示速度をちょこっとだけ改善してみる

ブログ

最近、筆者のブログの読み込みが遅いと指摘されました。画像もさほど多くないブログですし、立派なテーマをつかっているし、そんないじってないしなーと思いつつ。サイト表示速度測定サイトでトップページはかってみました。GTmetrixというサイトです。→ GTmetrix | Website Speed and Performance Optimization

f:id:kiyoshi_net:20170207141549p:plain

トップページの読み込みに17.3秒!!

うわ、私のブログ、おそすぎ?

あー、たしかに、続きを読むとかにしてなくて最近書いた記事がフルフルで表示されてるな。試しに一番最近に書いた記事「iPhone6s バッテリー交換プログラム」を見てみました。

f:id:kiyoshi_net:20170207142021p:plain

8.6秒。まー、写真のある記事だったのでこんなものでしょうか。

ググりながらそれとなくやってみる

javascriptとかcssとか、見よう見まねで書き足してきた記憶はあるので、いずれ不要なコードを消す必要があるのだが、いまのところ実力的にそれは難しいので(泣)、簡単なところから初めて見ることにしました。

トップページの記事数

設定→詳細設定

訪問者に最近書いた記事をいっきに見てもらおうと欲張って7にしてましたね。3くらいにしておきますか。

f:id:kiyoshi_net:20170207142607p:plain

3にした結果。

f:id:kiyoshi_net:20170207142957p:plain

おや、一気に7秒。さきほどやった、個別記事より表示速度がはやくなりましたね。測定サイトのブラウザにキャッシュが効いたのでしょうか?

まだ、3記事にしたものの、一つ一つの記事はフルで表示されちゃってますね。。。続きをよむ、とかMore…とかにしたいですね。やりかたは2つあるようです。

  1. 各記事に「続きを読む」を挿入する

    • staff.hatenablog.com
    • 個別の記事も続きを読む、ってわざわざ検索で訪ねてきた人にワンクリック追加で押させることになのではないかと心配したんですが、各記事のURLをクリックしてページを訪れた場合は「続きを読む」が挿入されな い仕様だったので一安心。トップページだけに有効な機能だったんですね。
  2. ブログトップを ブログURL/archive に変える

    • www.ito-tomohide.com
    • これは一覧で表示される記事が多すぎる・・・。3記事くらいでいいのに、数カ月分がどばっとでるぞ。。。

今回は「1. 各記事に「続きを読む」を挿入する」を導入。これまでの記事全部やるのは大変だったので、とりあえず直近の3記事だけ、「続きを読む」をいれてみました。

結果。

f:id:kiyoshi_net:20170207145805p:plain

お、6.2秒になった。

はてなブックマークのコメントを非表示

もとよりコメントなんて頂いていないわけで、不要な外部アクセスを抑制できそうなので、非表示を選択してみました。

f:id:kiyoshi_net:20170207152212p:plain

あれ、ちょっと増えて7.2秒になった。先の6秒台がまぐれだったのか。

f:id:kiyoshi_net:20170207152455p:plain

ソーシャルパーツ

いらないソーシャルパーツを消す。Facebookはほとんどからみがないからはずそう。

f:id:kiyoshi_net:20170207153333p:plain

効果は・・・。

f:id:kiyoshi_net:20170207153551p:plain

お、初の5秒台。これは効果があったっぽいぞ??

はてなスターも外したら速くなりそうだけど・・・、スターははてなブログで書き続けるモチベーションなので、これは外せないな。

サイドバー

サイドバー。

これを改善すれば速くなりそう。。。

厳選してみよう。

  • プロフィール
  • スポンサードリンク(アドセンス)
  • リンク
  • 月別アーカイブ(自分用)
  • 注目記事
  • カテゴリー

結果・・・。

f:id:kiyoshi_net:20170207154423p:plain

5.1秒!おしい、4秒台まであとわずか!

最後にもう一回個別ページ。

改善作業前は8.6秒だった個別ページ(6Sバッテリー交換)、さぁどれだけ改善されているか???

f:id:kiyoshi_net:20170207160428p:plain

え!12秒!!!4秒ちかくも遅くなってる・・・。なんやねんこれ。

比較用にクリーンなブログで検証

比較用にクリーンなブログを用意して、検証してみる。クリーンなブログははてなブログproの機能で10個つくれるので、ダミーでつくってみた。

新しいブログの作り方: ダッシュボード → 新しいブログを作成

とりあえず記事を書く前の結果。

f:id:kiyoshi_net:20170207161048p:plain

3秒台でたー。「これが若さか・・・」

3日分の記事はコピペ(写真もはてなフォトライフの同じ写真向いてる)して、計測してみると。。。

f:id:kiyoshi_net:20170207161819p:plain

え、なにこれ?16秒???記事の量がまずかった?続きを読む、有効になってるけど全部読みにいってる?なれないアドセンスが急にでてきたから??? 詳細不明。

まとめ

  • 表示記事の個数を減らす、は効果あり
  • SNSボタンをけずる、は効果あり
  • サイドバーの項目けずる、は効果あり

  • つられて個別記事の表示速度も改善されそうなものだが、なぜか個別ページは改善効果なし。

  • 強引の前後のタイムだけ比較すると・・・17.3秒→5.1秒!(12.2秒もはやくなりました!)

がんばってみたものの、じゃっかん理解不能な結果になりましたが、まーよしとしましょう!

そんじゃーの!