Introduction
Query strings are URLs that contain either ? or &. Static resources (such as JavaScript and CSS) are usually cached by proxies or CDNs. When a developer makes a change, it will not be rendered instantly due to caching effects, which is when query strings come into play. These strings are not cached, thus allowing updates to be rendered immediately. However, it will also increase the loading time of a webpage. Website optimization tools suggest removing query strings from static resources to increase website speed. This is especially useful for a WordPress site, as it will provide it with many benefits.
Removing query strings from static resources will enable caching on proxy servers, thus increasing the overall WordPress site speed. Your CSS and JavaScript will make fewer server requests, thus decreasing the resource usage of your WordPress site. This will also give your WordPress site a SEO boost, as WordPress sites with better optimization generally have a higher rank on Google.
The downside of query string removal in WordPress can be easily overcome by managing your cache, which will be further explained in this WordPress optimization guide.
Removing query strings from static resources (CSS, JavaScript) in WordPress via functions.php
IMPORTANT! Make sure to have a backup of functions.php file before making any changes.
Query strings can be removed from WordPress by adding this code at the bottom of your functions.php file located in wp-includes directory:
// Remove query string from static files
function remove_cssjs_ver( $src ) {
if( strpos( $src, '?ver=' ) )
$src = remove_query_arg( 'ver', $src );
return $src;
}
add_filter( 'style_loader_src', 'remove_cssjs_ver', 10, 2 );
add_filter( 'script_loader_src', 'remove_cssjs_ver', 10, 2 );In some cases (depending on your WordPress configuration) this code can cause 500 Internal Server Error. In that case, the plug-ins from Step 1 will do the trick.
Countering the downside of query string removal in WordPress
Proper management of WordPress cache will allow you to deliver the latest files to all visitors without causing any issues. If you are using WordPress caching plugins, you will simply need to clear your WordPress cache after making a change. Same goes if you implemented browser caching for your WordPress site, clearing the browser cache will let you see the latest changes. These few tricks will let you counter the small disadvantage that removing query strings from static resources in WordPress may cause.
Testing the changes
For comparison, here are the results of GTMetrix analysis after removing query strings from static resources in WordPress:
Conclusion
In this short guide, we have learned how to increase the performance of your WordPress website by removing query strings from static resources such as JavaScript or CSS.
