WordPressサイトのパフォーマンス改善のため、時に静的リソースからクエリ文字列を削除したいことがあります。CSSファイルとJavaScriptファイルのURLの末尾には通常、ファイルバージョンが含まれます(例:domain.com/style.css?ver=4.6
)。しかし、一部のサーバーやプロキシサーバーでは、cache-control:public
ヘッダーがあっても、クエリ文字列を正しくキャッシュできないことがあります。
クエリ文字列を削除することで、キャッシュのパフォーマンスが改善されることがあります。また、GTMetrixおよびPingdomに表示される「Remove query strings from static resources(静的リソースからクエリ文字列を削除してください)」という推奨メッセージも解消されます。
クエリ文字列は何らかの理由があって含めるものです。ファイルのバージョン管理は、WordPressの開発者がキャッシュの問題を回避するための方法で、たとえば更新の際にstyle.css
を?ver=4.6
から?ver=4.7
に変更すると、異なるURLとして認識され、キャッシュされません。クエリ文字列を削除してプラグインを更新すると、キャッシュされたバージョンが引き続き配信されることがあります。この場合、キャッシュされたリソースが期限切れになるか、キャッシュが完全にクリアされるまでサイトのフロントエンドが正常に表示されなくなる可能性があります。
クエリ文字列はまた、開発ワークフローの整理にも使用されます。
静的リソースからクエリ文字列を削除する方法
クエリ文字列を削除する方法は2種類あり、コードを編集するか、WordPressプラグインを使用します。CDNを使用してアセットを提供している場合、CDNサービスによってはクエリ文字列をキャッシュできるため、この作業は不要かもしれません。以下を実践する前に、ご利用中のホスティング会社とCDNサービスの両方に問い合わせ、クエリ文字列をキャッシュできるかを確認してください。KinstaのCDNはクエリ文字列のキャッシュが可能です。
1. コードを編集して静的リソースからクエリ文字列を削除する
コードを数行追加するだけで、アセットからクエリ文字列を簡単に削除できます。WordPressテーマのfunctions.php
ファイルに以下を貼り付けてください。
function remove_query_strings() {
if(!is_admin()) {
add_filter('script_loader_src', 'remove_query_strings_split', 15);
add_filter('style_loader_src', 'remove_query_strings_split', 15);
}
}
function remove_query_strings_split($src){
$output = preg_split("/(&ver|\?ver)/", $src);
return $output[0];
}
add_action('init', 'remove_query_strings');
注)WordPressテーマのソースコードを誤って編集すると、ウェブサイトが壊れる可能性があります。コードの編集に慣れていない場合は、この作業を開発者に依頼するか、無料プラグインのCode Snippetsを使用することをおすすめします。
プラグインをインストールして有効化したら、新規スニペットを作成し、上記のコードを追加するだけでOKです。「Only run on site front-end」(サイトのフロントエンドでのみ実行)を選択して保存してください。以上でクエリ文字列の削除が完了です。フロントエンドで変更を反映するには、WordPressサイトのキャッシュをクリアする必要があります。
クエリ文字列あり(コード実行前)
クエリ文字列を読み込むスクリプトは、以下のようになります。
クエリ文字列なし(コード実行後)
クエリ文字列が削除されると、以下のようになります。
2. プラグインを使用して静的リソースからクエリ文字列を削除する
コードを編集する代わりに、WordPressパフォーマンスプラグインを使用する手もあります。たとえば、Kinstaの社員が開発した有料プラグインPerfmattersを使用すると、ボタンのクリックだけで静的リソースからクエリ文字列が削除できます。このプラグインには他にもWordPressサイトの最適化に役立つ機能が組み込まれており、既存のキャッシュプラグインとの併用も可能です。
クエリ文字列の削除後
上記のいずれかの方法でクエリ文字列を削除した後、GTMetrixやPingdomのようなツールで再度サイトをテストすると、クエリ文字列に関する警告が表示されなくなるはずです。