当記事では PageSpeed Insights の表示で、「テキスト圧縮の有効化」をせよと指示されるケースの対策と改善手法をご紹介します。
上図ではテキストリソースの JavaScript や CSS を圧縮して通信量を抑えるように指摘されています。
この対策について見ていきましょう。
目次
改善対策
テキスト圧縮は、ウェブサーバーが返すリソースへ圧縮の指定がよくある手法です。
gzip と deflate の指定を追加
Apache などの Web サーバーで gzip や deflate の圧縮指定をします。
圧縮指定をすれば PageSpeed の表示が消えて、速度改善が期待できます。
具体的な設定はサーバーに合わせた指定をしてください。
レンタルサーバーは .htaccess に指定
Web サーバーの設定を直接変更できないレンタルサーバーなどは、.htaccess に記述して deflate の圧縮指定を追加できる場合があります。
ご利用のレンタルサーバーの設定を確認してください。
以下は Apache を利用しているケースでの .htaccess の圧縮指定の紹介です。
.htaccess の IfModule mod_rewrite.c タグ内に AddOutputFilterByType DEFLATE を追加します。
<IfModule mod_rewrite.c>
AddOutputFilterByType DEFLATE text/html
</IfModule>
これは HTML だけしか指定していないので、他にも追加する場合は後ろに複数追加できます。
<IfModule mod_rewrite.c>
AddOutputFilterByType DEFLATE text/html text/plain text/xml text/css text/js application/x-javascript application/javascript
</IfModule>
js と css が PageSpeed の指摘にありましたので追加しました。
パフォーマンスへの影響を確認
再度 PageSpeed Insights を確認します。
deflate 設定前の点数
deflate の指定前は37点でした。
deflate 設定後の点数
こちらが deflate 設定後の点数です。
37点から66点になっています😁
29点の改善となりました。
この結果を踏まえると、速度改善では gzip と deflate の圧縮をまず検討するべきと言えますね。
参考
mod_deflate – Apache HTTP サーバ バージョン 2.2
CAMON.TOKYO の吉澤修です。
記事に関連したお困りごとやお仕事のご相談などはお問い合わせからご連絡ください。