はてなブログが重い理由と改善方法を紹介

f:id:quietplace_1:20200608023231j:plain

追記:2020/06/08にリライトしました。

JSと画像がかなり重い

はてなブログってめちゃくちゃ重いですよね。
で色々と分析していたらJSと画像が重すぎました。

JSに関してがデフォルトで色々と付いてるものが多いのでユーザー側では何もいじれません。
多分自分がカスタマイズで消し忘れてるJSもあると思いますが...(笑)

f:id:quietplace_1:20200607175108p:plain

改善

JSが無理となると画像を改善するしかないです。

はてなブログはWebpをアップロードできないっぽいのでサーバーを建ててWebPのリンクを貼るのもありかもしれませんがそこまでやる人も居ないと思う(やってたらWordPressでやると思う)ので画像を圧縮しましょう。

 オンラインで圧縮するならJPGイメージをオンラインで圧縮する がおすすめです。

あとアイキャッチpngではなくjpgにしましょう。

今後の話

今の時代はモバイルの高速化が必須で今wpで作っているサイトはPWAとかAMPに対応させました。(はてなブログProでAMP対応可能)

PWAはある程度モバイルで速度が速くないとLighthouseでフラグを立てます。

現在制作中のサイト速度(WordPress)(76)

f:id:quietplace_1:20200607175743p:plain

WordPressだったら?

キャッシュ系プラグインってかなり不具合が多いのですがAutoptimizeというプラグインが安定しています。

画像圧縮は「Compress JPEG & PNG images」を使っています。

無料版だと一ヶ月に500枚までしか圧縮できませんがAPIを使っているのでサーバーに負荷を掛けません。

PageSpeed Insightsで80くらいスコアが出ます。(モバイル)

Lighthouse 6.0以前だと90は超えていました。