One of the most common performance issues in WordPress is plugins and themes loading their own scripts and stylesheets (CSS & JS) on every page, without checking whether those assets are actually needed.
For example, a plugin that only works on the WordPress admin dashboard may still load its scripts on the frontend. Another plugin that is only relevant on a specific page template loads its CSS site-wide.
Plugins and themes load these assets indiscriminately, adding unnecessary HTTP requests to every page on your site. This directly hurts loading time and overall performance.
When it comes to premium themes, the situation is even worse. These themes load a large number of assets throughout the site without any check if they are actually needed.
Developers of these themes try to target as wide an audience as possible. Their themes contain many options and element types, and therefore a lot of JavaScript and CSS files that your site may never use.
Since the theme developer does not know which elements the website owner intends to use, they load all assets so that the functionality works regardless of which elements are active.
Fortunately, WordPress offers a simple way to remove unnecessary assets using the functions wp_dequeue_style and wp_dequeue_script. Let’s see how to do it.
Find the Asset Handle (ID)
The first step is to find the unique handle of the CSS or JavaScript file you want to remove. There are several ways to do this:
- Check the
<link>or<script>tag in the page source - Find the source code responsible for enqueueing the asset
The simplest way is to inspect the HTML source of your page. For example, suppose you want to prevent the CSS file of the Contact Form 7 plugin from loading. A look at the HTML will show markup similar to this:
<link rel='stylesheet' id='contact-form-7-css' href='https://savvy.co.il/wp-content/plugins/contact-form-7/includes/css/styles.css?ver=6.0.6' type='text/css' media='all' />The id attribute shows contact-form-7-css. However, this is not the actual handle. WordPress appends -css to CSS handles and -js to script handles automatically.
So the real handle for this file is contact-form-7. If we look at the JavaScript file loaded by this plugin:
<script type="text/javascript" src="https://savvy.co.il/wp-content/plugins/contact-form-7/includes/js/index.js?ver=6.0.6" id="contact-form-7-js"></script>The handle for the script is also contact-form-7. In this case both the CSS and JS handles are the same, but that is not always the case with other plugins.
Depending on the version of the plugin you are using, it may load additional files. You can find these by inspecting the HTML and looking at the folder name in the file path.
How to Prevent Loading the Files
Once you have the handle, removing the asset is straightforward. Continuing with the Contact Form 7 example, add the following code to your theme’s functions.php file (or preferably to a child theme’s functions.php):
function sv_disable_scripts_styles() {
wp_dequeue_style( 'contact-form-7' );
wp_dequeue_script( 'contact-form-7' );
}
add_action( 'wp_enqueue_scripts', 'sv_disable_scripts_styles', 100 );For stylesheets we use wp_dequeue_style() and for scripts we use wp_dequeue_script().
The priority parameter (100 in the example) is critical. WordPress processes the wp_enqueue_scripts hook in priority order. If your dequeue runs before the plugin enqueues its assets, nothing will be removed. Always use a priority higher than the original enqueue – 100 is a safe default, or use PHP_INT_MAX to guarantee your callback runs last.
In the case of Contact Form 7 specifically, the plugin developer added built-in filters to disable its assets. You can prevent loading them by adding this code instead:
function sv_remove_cf7_assets() {
add_filter( 'wpcf7_load_css', '__return_false' );
add_filter( 'wpcf7_load_js', '__return_false' );
}
add_action( 'wp', 'sv_remove_cf7_assets' );If you want to take CF7 optimization further, check out our guide on optimizing Contact Form 7 for better performance.
Conditional Dequeuing
The examples above will remove the assets from every page on the site. In most cases, you want to remove them only on pages where the plugin is not needed.
For example, the following code removes Contact Form 7 assets from all pages except those using a specific page template:
function sv_disable_scripts_styles() {
if ( ! is_page_template( 'contact-template.php' ) ) {
wp_dequeue_style( 'contact-form-7' );
wp_dequeue_script( 'contact-form-7' );
}
}
add_action( 'wp_enqueue_scripts', 'sv_disable_scripts_styles', 100 );You can use any WordPress conditional tag here: is_front_page(), is_single(), is_page(), is_post_type_archive(), and so on.
Dequeue vs. Deregister
WordPress provides two pairs of functions for removing assets, and understanding the difference is important:
wp_dequeue_style()/wp_dequeue_script()– removes the asset from the current page load, but keeps it registered in WordPress. Another plugin or theme can still re-enqueue it later.wp_deregister_style()/wp_deregister_script()– completely removes the asset from the WordPress registry. It cannot be enqueued again unless it is re-registered first.
In most cases, wp_dequeue_style() is all you need. If you want to make sure an asset never loads (even if another plugin tries to enqueue it), use both:
function sv_fully_remove_asset() {
wp_dequeue_style( 'some-handle' );
wp_deregister_style( 'some-handle' );
}
add_action( 'wp_enqueue_scripts', 'sv_fully_remove_asset', 100 );Never deregister core WordPress scripts like jquery, wp-embed, or wp-i18n. Removing these can break the admin interface, the block editor, or other plugins that depend on them. Only dequeue or deregister assets that belong to themes or third-party plugins.
If you are looking for a WooCommerce-specific example, we have a dedicated guide on preventing WooCommerce from loading its JS and CSS files on pages that do not need them.
If you want to learn the full enqueue system, including how to properly load your own scripts and stylesheets, see our post on how to properly enqueue CSS and JavaScript in WordPress.
FAQs
Common questions about removing CSS and JS files in WordPress:
wp_dequeue_style() and wp_deregister_style()?
wp_dequeue_style() removes the stylesheet from the current page load but keeps it registered in WordPress. wp_deregister_style() removes it from the registry entirely. For most cases, dequeuing alone is sufficient. Use both together only when you need to prevent other code from re-enqueuing the asset.wp_dequeue_script() not work for me?
PHP_INT_MAX. Also double-check that you are using the correct handle name.id attribute on the <link> or <script> tag. WordPress appends -css or -js to the handle, so remove that suffix to get the real handle. Alternatively, search the plugin's source code for wp_enqueue_style() or wp_enqueue_script() calls.functions.php or a custom plugin?
functions.php so updates do not overwrite your changes. A small custom plugin (or an MU-plugin) is another clean option that keeps your dequeue logic independent of the theme.wp_dequeue_style() and wp_dequeue_script() with WooCommerce-specific handles to remove them on non-shop pages.Summary
Plugins and themes often load CSS and JavaScript files on every page of your WordPress site, even where they are not needed. Use wp_dequeue_style() and wp_dequeue_script() with the correct handle and a high priority to remove unnecessary assets. Combine with conditional tags to keep assets only on pages that actually need them. This is one of the most effective steps you can take to reduce HTTP requests and improve your site’s loading time.
