They may not be needed for two reasons:
- They’re not part of the above-the-fold content — the most important content that needs to be rendered.
To load the page faster, the browser should analyze and render only the essential resources – mainly HTML code. On a side note, that’s also why you should eliminate the JS and CSS render-blocking resources that slow down the page’s loading.
A typical example of such JS files is third-party code, such as Google Analytics and Facebook tracking codes.
- They’re in the code, but they’re not used anymore. They’re completely useless.
The First Input Delay measures a page’s responsiveness by taking into account the user interaction — therefore, it can only be calculated on the field.
|🚀 Want to know more about Lighthouse? Read our article on how to improve your Lighthouse performance score!|
How to Find the Unused JS to Eliminate
Let’s go over two easy and straightforward tools: PageSpeed Insights and GTmetrix.
Finding Unused JS via PageSpeed Insights
Finding Unused JS via GTmetrix
As we mentioned above, most heavy JS scripts are related to tracking codes (e.g., Google Tag Manager) and plugins. You can easily understand it by looking at the Domain column.
How to Remove Unused JS Files on WordPress: Two Methods
You can remove unused JS files in two ways:
Please note that not all the scripts from the PageSpeed recommendation list can be safely delayed. You should only delay the JS files that are above the fold because they’re render-blocking resources.
The two options are complementary as each method tackles a different aspect of managing unused JS.
On the one hand, delaying JS will control when the code is executed. It’s technically a workaround rather than a fix. But it has its effect since it’s making JS non-render-blocking.
On the other hand, unloading unnecessary assets will reduce the size of JS on the page. It’s technically reducing unused JS rather than totally removing it.
Note: even using such methods, it’s hard to get rid of the PageSpeed Insights notification. Lighthouse flags any file with more than 20kb of unused JS code.
Since most themes and plugins come with bundled JS files, it’s very likely the above limit will be exceeded in many files. In other words, combining JS will almost guarantee that you will always get the recommendation showing.
That’s why in most cases, the ultimate goal is to reduce the effect of removing unused JS rather than completely fixing it.
A good example is the jQuery library when it can’t be delayed. It will always be flagged for unused JS.
Removing Unused JS Resources with Plugins
The option is straightforward to use and will help you save tons of time and effort!
WP Rocket will take care of everything, and you’ll see an evident difference in your performance score and the PSI report.
On the other hand, you can use an asset manager plugin to control where specific files will be loaded, such as:
Thanks to WP Rocket, you can easily manage unused JS and tackle the performance issue.
You can always count on our 100% money-back guarantee. Although we don’t think you’ll ever want one, we’ll gladly provide a refund if you request it within 14 days of purchase.
🚀 The only risk you’ll be taking with our plugin is speeding up your website. WP Rocket automatically applies 80% of web performance best practices, instantly boosting your Core Web Vitals scores.