表示スピードの高速化に役立つ!JavascriptやCSSファイルに自動で付与されるバージョン番号を非表示にする方法

Wordpress 【img via arsp_021 by theanthonyryan

ページの表示速度は早ければ早い方が良い。表示スピードの高速化は媒体運営者にとって永遠のテーマかもしれない。

昨日、夜な夜な高速化について調べていたら衝撃的な事実を知った。当ブログは無料のCDNサーバー「CloudFlare」を導入しているのだが、URLの末尾が「キャッシュ対象の拡張子」に見えなければキャッシュされないらしい!

デフォルトだとJavascriptやCSSファイルにバージョン番号が自動的に付与される仕組みになっているが、これを非表示にする方法を見つけたので紹介する!



バージョン情報が表示されるとはこういうこと!

これまでのソースを見ると、以下のようにJavascriptやCSSの末端にバージョン番号が付与されている。

Wordpress version
CloudFlareでキャッシュ可否の条件は「URLの末尾がキャッシュ対象拡張子に見えること」だった」によると、キャッシュされるためにはURLの末尾が対象拡張子で終わっている必要があるそうだ。

せっかく導入しているCDNサーバーにキャッシュしたいファイルがされないのは意味がない!JavascriptやCSSファイルに自動的に付与されるバージョン番号を削除する必要がある。

functions.phpにコードを追加して削除!

早速方法を調べたら、「WordPress: ロードしているJSやCSSに自動で付与されるバージョン番号を非表示に」にfunctions.phpにコードを追加してバージョン番号を非表示にする方法が紹介されていた!

すべての「?ver=」を非表示にする方法とWordpressのバージョン番号の「?ver=」を非表示にする方法の2種類が紹介されていた。僕は迷わずすべてのバージョン番号を非表示に!

すべての「?ver=」を非表示にする方法

// remove wp version param from any enqueued scripts
function vc_remove_wp_ver_css_js( $src ) {
    if ( strpos( $src, 'ver=' ) )
        $src = remove_query_arg( 'ver', $src );
    return $src;
}
add_filter( 'style_loader_src', 'vc_remove_wp_ver_css_js', 9999 );
add_filter( 'script_loader_src', 'vc_remove_wp_ver_css_js', 9999 );

WordPressのバージョン番号の「?ver=」を非表示にする方法

// remove wp version param from any enqueued scripts
function vc_remove_wp_ver_css_js( $src ) {
    if ( strpos( $src, 'ver=' . get_bloginfo( 'version' ) ) )
        $src = remove_query_arg( 'ver', $src );
    return $src;
}
add_filter( 'style_loader_src', 'vc_remove_wp_ver_css_js', 9999 );
add_filter( 'script_loader_src', 'vc_remove_wp_ver_css_js', 9999 );

導入してスッキリ!キャッシュもされるはず!

コードを記述後、ソースを確認すると以下の通りバージョン番号がなくなっている!素晴らしい!

Wordpress バージョン番号
これで多少ページ読み込み速度の高速化には貢献できるはず!導入したばかりなので、しばらく様子を見てみることにする!

表示速度を劇的に向上する、無料のCDNサーバー「CloudFlare」は導入必須だ!! | gori.me

wordpress.jpg

gori.meの最新情報をチェック!!

  1. delete-iphone-else-top.jpg
    【保存版】iPhoneのストレージ容量不足を劇的に解消する7つの方法
  2. 5dmk4.png
    ついに登場!キヤノンの最新フルサイズ一眼レフカメラ「Canon EOS 5D Mark IV」が正式発表!Lレンズ2本も同時発表
  3. The-Wolfe-Supercharging-GPU-Unit.jpg
    「MacBook Pro」用の外部GPUユニットがKickstarterに登場
  4. Mac-Storage-Technique.jpg
    【保存版】Macの「その他」を削除し、ストレージ容量不足を解消する方法
  5. cp-ranking-powerup-or-evolve
    【ポケモンGO】CPの最大値による最強ポケモンランキングが公開!ポケモンを強化・進化させる方法