WordPressテーマのSimplicityを.htaccessの変更で高速化する。

WordPress

Simplicityを高速化し、さらなるパフォーマンスアップをする方法を、Simplicityの作者(わいひらさん)が「コピペ一発でSimplicityを結構高速化する方法」で紹介されていましたので実行すると、かなりの高速化が図れました。
この設定でWordpress全体(共有ファイル、プラグインファイルなど)の全てのファイルに対して高速化設定が適用されます。

  • ブラウザのキャッシュの設定
    GIF、JPEG、PNG、CSS、JavaScript、WEBフォントファイル
  • リソースの圧縮設定
    TEXT、HTML、XHTML、XML、RSS、CSS、JavaScript、WEBフォントファイル

但し、この方法は、サーバーで採用されているサーバーソフトがApacheでないと利用できないそうですので、利用しているレンタルサーバーのサーバーソフトがApacheであることの確認が必要です。

スポンサーリンク

高速化の結果(評価)

.htaccessの変更前と、変更後の結果は、以下の通りです。

htaccessの変更前

PageScreen insights

Gtmetrix

htaccessの変更後

PageScreen insight

Gtmetrix

高速化の設定

/exsample.com/public_htmlの中の.htaccessを書き換えます。

.htaccessのダウンロード

FTPソフトで、.htaccessをダウンロードします。

.htaccessに、以下を追記します。

万が一編集に間違いがあるといけないので、必ず編集前にこのファイルをコピーしてバックアップをとっておきます。

# ETags(Configure entity tags) を無視する設定
<IfModule mod_headers.c>
    Header unset ETag
</IfModule>
FileETag None
# Enable Keep-Alive を設定
<IfModule mod_headers.c>
    Header set Connection keep-alive
</IfModule>
# MIME Type 追加
<IfModule mime_module>
    AddType image/x-icon .ico
    AddType image/svg+xml .svg
    AddType application/x-font-ttf .ttf
    AddType application/x-font-woff .woff
    AddType application/x-font-opentype .otf
    AddType application/vnd.ms-fontobject .eot
</IfModule>
# プロクシキャッシュの設定(画像とフォントをキャッシュ)
<IfModule mod_headers.c>
<FilesMatch "\.(ico|jpe?g|png|gif|svg|swf|pdf|ttf|woff|otf|eot)$">
    Header set Cache-Control "max-age=604800, public"
</FilesMatch>
</IfModule>
# ブラウザキャッシュの設定
<IfModule mod_headers.c>
<IfModule mod_expires.c>
    ExpiresActive On
    # キャッシュ初期化(1秒に設定)
    ExpiresDefault "access plus 1 seconds"
    # MIME Type ごとの設定
    ExpiresByType text/css "access plus 1 weeks"
    ExpiresByType text/js "access plus 1 weeks"
    ExpiresByType text/javascript "access plus 1 weeks"
    ExpiresByType image/gif "access plus 1 weeks"
    ExpiresByType image/jpeg "access plus 1 weeks"
    ExpiresByType image/png "access plus 1 weeks"
    ExpiresByType image/svg+xml "access plus 1 year"
    ExpiresByType application/pdf "access plus 1 weeks"
    ExpiresByType application/javascript "access plus 1 weeks"
    ExpiresByType application/x-javascript "access plus 1 weeks"
    ExpiresByType application/x-shockwave-flash "access plus 1 weeks"
    ExpiresByType application/x-font-ttf "access plus 1 year"
    ExpiresByType application/x-font-woff "access plus 1 year"
    ExpiresByType application/x-font-opentype "access plus 1 year"
    ExpiresByType application/vnd.ms-fontobject "access plus 1 year"
</IfModule>
</IfModule>
# Gzip圧縮の設定
<IfModule mod_deflate.c>
    SetOutputFilter DEFLATE
    # 古いブラウザでは無効
    BrowserMatch ^Mozilla/4\.0[678] no-gzip
    BrowserMatch ^Mozilla/4 gzip-only-text/html
    BrowserMatch \bMSIE\s(7|8) !no-gzip !gzip-only-text/html
# 画像など圧縮済みのコンテンツは再圧縮しない
SetEnvIfNoCase Request_URI \.(?:gif|jpe?g|png|ico)$ no-gzip dont-vary

# プロクシサーバーが間違ったコンテンツを配布しないようにする
Header append Vary Accept-Encoding env=!dont-vary
    AddOutputFilterByType DEFLATE text/plain
    AddOutputFilterByType DEFLATE text/html
    AddOutputFilterByType DEFLATE text/xml
    AddOutputFilterByType DEFLATE text/css
    AddOutputFilterByType DEFLATE text/js
    AddOutputFilterByType DEFLATE image/svg+xml
    AddOutputFilterByType DEFLATE application/xml
    AddOutputFilterByType DEFLATE application/xhtml+xml
    AddOutputFilterByType DEFLATE application/rss+xml
    AddOutputFilterByType DEFLATE application/atom_xml
    AddOutputFilterByType DEFLATE application/javascript
    AddOutputFilterByType DEFLATE application/x-javascript
    AddOutputFilterByType DEFLATE application/x-httpd-php
    AddOutputFilterByType DEFLATE application/x-font-ttf
    AddOutputFilterByType DEFLATE application/x-font-woff
    AddOutputFilterByType DEFLATE application/x-font-opentype
    AddOutputFilterByType DEFLATE application/vnd.ms-fontobject
</IfModule>

変更した.htaccessをアップロードします。

サイトを確認して、何か問題があったら、先程バックアップしたファイルに戻します。

今回の計測では、CSS、JS、HTMLファイルの縮小や、複数ファイルの統一などの高速化設定は行っていないので、それらも設定をプラグインなどで、より効果の高いものになると、解説しています。
ありがとうございました。

コメント

タイトルとURLをコピーしました