Are you looking for how to remove unused JavaScript in WordPress? Then stay connected with this post. When you test your website on Google PageSpeed Insights, unused JavaScript is the most common speed factor that every site encounters.

Unused JavaScript files are the pinpoint of the WordPress users which deteriorate website performance and ultimately result in ranking loss. Let’s understand what are ‘unused JavaScript files’ and how to remove unused JavaScript in WordPress.

What Are Unused JavaScript Files In WordPress?

Unused JavaScript files are resources that are not needed for rendering the page. These could be third-party codes like ad codes, FB codes, plugins, unnecessary pop-ups, etc. They do not add much value to the website but take up significant space.

Although JavaScript enables you to add dynamic elements to your website pages that couldn’t be achieved with just HTML and CSS. On the other side, these essential codes overburden the server and slow down your website.

To load any website or webpage, the browser first downloads JavaScript files and saved them in the browser cache. JavaScript files are then unpacked, compiled, and finally, the files are executed on a page (that visitor trying to load).

So, you can understand how long a website takes to load a page is significantly affected by the unused size of JavaScript files. However, web page speed is not solely dependent on JavaScript, images also slow the website speed.

how to remove unused javascript in WordPress

According to the HTTP Archive, JavaScript accounts for 517.7 KB of that weight on desktop, and 469.2 KB on mobile. These figures are up 30.0% for desktop and 30.5% on mobile since December 2021.

While the total average size of a page is 2301.6 KB and 2003.2 KB for desktop and mobile respectively. You can see that JavaScript files take significant space on your website.

How To Remove Unused JavaScript In WordPress?

A website has some essential JavaScript files that are useful when visitors visit and scroll your web pages. But there are also unnecessary JS files (known as unused Js files) that add no value to pages like tracking codes.

Before removing unused JavaScript files, we have to find those js files and the best way to do this is using Google’s Page Speedtester. So, let’s learn how to remove unused JavaScript in WordPress in step by step process.

Find unused JavaScript files

The best and easiest way to find unused js is using Google’s Page Speed Insights. It displays all the factors that affect your website or individual page speed and the opportunities to improve the speed.

  • Go to the PageSpeed Insight using the browser
  • Type your website URL or web page URL in the blank space
  • Hit Analyze button

How To Remove Unused Javascript In WordPress

  • Once the page loads, select the mobile or desktop version
  • Scroll down the page and look for Diagnose performance issues

reduce unused javascript files

  • Under the opportunity section, you can see the Reduce unused JavaScript option, click on this
  • Now, you can see the unused file sizes and potential savings. We need to reduce unused JavaScript files as shown above

How To Remove Unused JavaScript In WordPress With Asset Cleanup Plugin?

Like CSS, it is not possible to completely remove the JavaScript files. But you can delay all your JavaScript till the user make its first interaction. In other words, you can reduce unused JavaScript sizes.

The asset Cleanup plugin is the best way to remove unused JavaScript in WordPress or delay JavaScript files that require a few clicks. Now, follow the below steps carefully:

1. Install the plugin

The first step to reducing unused JavaScript files is to download the Asset Cleanup plugin which can be downloaded from the Plugins section of WordPress. Then, go to Plugins>> Add new.

how to remove unused javascript in WordPress

Type Asset Cleanup in the search box, install the plugin, and activate the plugin. It will be added to your dashboard.

2. Enable “Test Mode”

This step is not mandatory but highly recommended to avoid any unwanted issues on site. You may see a preview of what happens when JavaScript files are removed by activating test mode before it is really applied to the page.

Open the Asset Cleanup plugin to enable test mode and head to the settings. Then, click on the test mode on the left sidebar, and activate the toggle ‘enable test mode?

reduce javascript files

A green indicator is activated on the test mode button if you have done this step appropriately. Now you can move to the next step.

3. Unload JavaScript files

This is the most crucial step for how to remove unused JavaScript in WordPress or reduce unused JavaScript files. Click on the second tab named CSS and JS manager. You will be on the homepage section.

how to remove unused javascript in WordPress

You can see the list of CSS and Js files on your homepage. Although these js files make your site slower, you can unload the unused js files to improve your site performance.

how to reduce js files

Click on the particular unused js file which opens various options to remove the file from your homepage. What you have to do is click on unload on this page. Alternatively, use the checkbox Unload site-wide to disable JavaScript files from your entire website.

disbale javascript file from website

Scroll down and click on the update button to save the settings. You can perform similar actions by selecting posts, pages, custom pages, media, tags, etc., instead of the homepage.

how to remove unused javascript

To remove unused JavaScript from posts and pages, enter the post id or page id in the blank space. You can check our post on How To Find Page Id In WordPress Or Post Id in WordPress? to find your posts and page id.

4. Disable test mode

Once performed all the above steps, check your website speed and work by running your website from the administration section. As you are still on test mode, so you can’t check live or be unable to check through Google’s Page Speed.

If everything is running smoothly and no issues are detected, disable the test mode from the settings section. Next, click on the enable test mode toggle, turn it off, and finally click on the update from the setting.

Other Plugins to remove JavaScript in WordPress

Though Asset Cleanup is the best and most easy-to-use plugin for how to remove unused JavaScript in WordPress yet, you can give it a try with other plugins too. Some of the popular plugins for removing unused JavaScript from websites are as follows:

  • WP Rocket- Best plugin to delay the execution of JavaScript files (till the user interact with the web pages)
  • CSS JS manager- A bit more complicated to remove CSS and Js than Asset Cleanup, yet very powerful
  • Perfmatters- Another powerful but paid plugin to reduce js files and improve site speed. It automatically detects which JavaScript file should load and which not.

How to remove unused JavaScript in WordPress manually (without plugin)

You can also remove unused JavaScript in WordPress without a plugin; however, it could be risky if you haven’t coding knowledge. Remove an element from the front of the queue, which is called de-queue.

To remove unused JavaScript from a website, you can de-queue elements from your functions.php file. Paste the below code on your website’s functions.php to disable unused JavaScript.

*/
function wp_remove_scripts() {
// check if user is admin, therefore only logged-out users won't load the script
if (current_user_can( 'update_core' )) {
return;
} 
else {
// Check for the page you want to target
if ( is_page( 'homepage' ) ) {
// Remove Scripts
wp_dequeue_script( 'jquery-ui-core' );
wp_deregister_script( 'jquery-ui-core' );
}
}
}
add_action( 'wp_enqueue_scripts', 'wp_remove_scripts', 99 );

The results appear on your website when you update and save the changes. This code might not work properly on all the WordPress themes. Please put the code very carefully on the theme; otherwise, it could jumble up your site.

However, I recommend using Asset Cleanup or WP Rocket plugin if you don’t have coding knowledge. Plugins are safe and easy-to-use tools.

Final Thoughts

I hope you love this article on how to remove unused JavaScript in WordPress websites. In this tutorial, we have learned both plugins as well as a manual method to disable unused JavaScript in WordPress.

The page speed is a crucial aspect of the growth of a website, and unused JavaScript files severely hit it. So, it is a must to remove them. You can find various methods to remove unused JavaScript from a website but using the Asset plugin is the simplest way to do so.

Leave a Reply