前回に引き続きパフォーマンス改善です。

今回はmod_deflateを利用してファイルを圧縮してリクエストで発生する転送量を減らします。
転送量が減る=ダウンロードするファイルサイズが減る=速度改善という理屈ですね。

ジッパー

ファイルを圧縮して転送量を削減する

mod_deflateを.htaccessで設定する

以下のコードを.htaccessに追記します。
dogmap.jpさんを参考にさせていただきました。

   SetOutputFilter DEFLATE
 
    # Mozilla4系などの古いブラウザで無効、しかしMSIEは除外
    BrowserMatch ^Mozilla/4\.0[678] no-gzip
    BrowserMatch ^Mozilla/4 gzip-only-text/html
    BrowserMatch \bMSI[E] !no-gzip !gzip-only-text/html
 
    # gifやjpgなど圧縮済みのコンテンツは再圧縮しない
    SetEnvIfNoCase Request_URI \.(?:gif|jpe?g|png|ico)$ no-gzip dont-vary
    SetEnvIfNoCase Request_URI _\.utxt$ no-gzip
 
    # htmlやcssなどは圧縮
    AddOutputFilterByType DEFLATE text/plain
    AddOutputFilterByType DEFLATE text/html
    AddOutputFilterByType DEFLATE text/xml
    AddOutputFilterByType DEFLATE text/css
    AddOutputFilterByType DEFLATE application/xhtml+xml
    AddOutputFilterByType DEFLATE application/xml
    AddOutputFilterByType DEFLATE application/rss+xml
    AddOutputFilterByType DEFLATE application/atom_xml
    AddOutputFilterByType DEFLATE application/x-javascript
    AddOutputFilterByType DEFLATE application/x-httpd-php

ざっとした流れとしては、「動作しないブラウザ」「対象じゃないファイル」「対象ファイル」の3つを設定していますね。

確認

Response Header

ページを開いてデベロッパーツールでResponse Headerを確認すると「Content-Encoding: gzip」となっていますね。
圧縮できていることを確認です。

HTTPレスポンス

Pagespeed Insight

モバイル:56点→62点
パソコン:68点→72点

スコアはだいぶ改善されてきましたね。
画像の最適化は避けて通れないということか。
でも未だにモバイルのスコアが低い、うーむ。

Pagespeed Insight (2)

Pagespeed Insight (1)

GTMetrix

62%→68%
徐々に上がっているけど、まだまだですねぇ。

GTMetrix

感想

予想以上に劇的な改善が見られないので少し残念でした。
やはりJavascriptやcssなどの外部ファイルの読み込み部分が一番よろしくないのでしょうか。

次はここに着手してみようと思います。

いつもシェアありがとうございます!気に入ったらシェアしていただけたら幸いです。