7 Brilliant Ways To remove query strings from static resources

Google is presently using page speed as a key factor to rank pages in their search results. When you are a content marketer, blogger, writer or admin of any website, you must always have a closer look at all the aspects which may slow down your website.

Remember that the smoother your website is, the better will be the engagement. Nowadays, it’s not difficult to work to detect the reason or element that can slow down your web page. Just search for GTmetrix, Pingdom, Page Insight and lot more other tools are out there.

I’m a big fan of GTmetrix because of it’s detailing in every aspect. Starting from leverage Browser caching to keep alive GTmetrix will give you separate information for each of the problems. You can also check Yslow performance rating for your pages.

Here you may like to know how to fix scaled image issue using the GTmetrix tool, without cutting or resizing your images.

In this post, we are going to find some solution for one of the major warning that appears on page performance checker tools. And the warning is to remove query strings from static resources. If your page contains some query string then GTmetrix will show a warning saying that “remove the query strings from static resources“, like the example below.

 

What is a query string?

Query strings are the URLs which contains “?” Or “&” symbols in it. Normally, query strings are so long and are not that useful during responding back to the server request. This kind of links can be available inside the source code of your web page.

The disadvantage of having the query string in the source code is that most proxy server doesn’t cache CSS and JavaScript contents that contain these strings. Also, the data available in a query string are easily visible to the front end user which can create a security issue.

How query string increases the page loading time

When you will be warned by GTmetrix to remove query strings from static resources this question may pop in your brain. It should be. Before taking any action against that warning you should know what is the damage caused by these query strings.

The static contents of a web page like CSS, HTML, and JavaScript plays a very essential role in the loading time of a specific web page. If that page has the query strings in its content, caching of those static resources will be blocked by does string.

Due to this reason, there will be latency occurred in server response time to the browser’s request. And ultimately your page will load slower than usual. Here is a useful guide to reducing server response time.

How to remove query strings from static resources

You can remove query strings using many different ways. However, it depends on how you want to do it. If you are familiar with code configuration inside the function.php or .htaccess file then you can remove query strings by adding some small pieces of codes inside these two files.

Either way, you can choose different plugins from WordPress collection which will help you to remove query strings from static resources. I will list all the working methods and plugins which will help you to fix the issue. In case, you are using a paid theme and updating your theme frequently for fetching the latest updates, it would be better to use plugins instead of adding PHP code.

The reason is, your PHP code might get deleted automatically after a theme update. However, You can take advantage of the Child theme for such customization.

Remove query strings using function.php file

In this method, go to your WordPress dashboard > Customization > Editor > find the function.php file. Add the following codes inside the function.php file.

//* TN - Remove Query String from Static Resources function remove_css_js_ver( $src ) { if( strpos( $src, '?ver=' ) ) $src = remove_query_arg( 'ver', $src ); return $src; } add_filter( 'style_loader_src', 'remove_css_js_ver', 10, 2 ); add_filter( 'script_loader_src', 'remove_css_js_ver', 10, 2 );

Remove query strings using the .htaccess file

Go to your file manager and enable hidden file show option. On your domain root, you should see a file .htaccess. Download the file and keep a backup. Now open the file in Notepad++ and add the following code there. If you wish you can use the local editor inside your hosting file manager too. But having a backup is recommended in both cases.

RewriteRule ^index.php$ - [L] RewriteCond %{REQUEST_FILENAME} !-f RewriteCond %{REQUEST_FILENAME} !-d RewriteRule . /index.php [L]

If you find difficult to go through these two methods, try using any of these plugins. I always recommend you to try each of them and keep using the most working plugin in your case.

 

These are the plugins you can use to remove query strings from static resources:

 

1. Remove Query Strings From Static Resources – WP Plugin

This is one of the most popular plugins in this case. The plugin configuration is really simple, all you need to install the plugin and it will work for you. For the beginners who don’t want to mess with the codes, this plugin can be very helpful to remove the query strings. However, I noticed that the plugin was last updated 12 months ago.

A regularly updated plugin can do much better work than a non-updated plugin. In this case, you need to install this plugin and see whether your problem is fixed or not.

 

2. W3 Total Cache – WP Plugin

Using W3 total cache you can remove your query strings quite easily. W3 Total Cache is one of the most popular caching plugins for WordPress. With various other configurations, you can configure your WordPress for removing query strings. For that you need to disable “prevent caching of an object” and it will remove query strings from 90% of the URLs.

Go to the general tab of total cache and find “Prevent caching of objects after settings change” option. UNCHECK it and click on ‘Save Settings’ button. Now ‘Empty all Cache’ and you are done. Check your page loading speed once again and your issue should be solved.

3. Lite Speed Cache Plugin

Lite Speed WordPress plugin is another great plugin to enable caching for your site and it’s capable of optimizing your website nicely. This plugin can increase your page performance by a huge difference if you are currently having a slow and low optimized website.

Along with other settings, lite speed cache plugin has an option to remove query strings from static resources. To enable this option you need to go to the “tuning tab” after installation. In the mid portion of that tab, there is the option to remove query strings. You need to enable the option and save it. Then clear your cache and your problem will be solved.

4. Autoptimize Caching Plugin

Autoptimize plugin is recommended by Google itself, for having better page performance. Autoptimize is easy to configure. It can aggregate, minify and cache scripts and styles, injects CSS in the page head by default. You can move and defer scripts to the footer and minify the HTML.

Like other caching plugins all you need to check the remove query string box and save. Once done clear the cache and check your page once again on GTmetrix or Pingdom or page insight.

 

5.Query Strings Remover – WP Plugin

This is another lightweight WordPress plugin to remove query strings from static resources. You can download this plugin from the WordPress plugin repository for free. Install and Activate the plugin. Unlike the other plugins, there is no configuration or setting page.

Activate it and you are good to go. Purge all the cache (if you are not using any caching plugin then clear your cache on Cloudflare) and check your website on Pingdom. All the Query Strings will be disappeared automatically from static resources.

Here is my blog’s performance score on GTmetrix:

Conclusion: Removing Query Strings from Static Resources like CSS & JavaScript is very important if you want to enable the caching of Static Resources on Proxy Servers. Apply these methods, mentioned above and your issue should be solved easily. Share this article if you like it.