Inbox: How do I remove jQuery

After writing an article on how unenqueuing the jQuery that ships with WordPress core is a bad idea, I’ve received quite a bit of hate mail. I still stand by my points in that article, and fully expect to write a followup on properly offloading static assets to a CDN.

Today, though, I want to address a different jQuery-related issue: how do you remove the library from a site if you’re not using it? From my inbox this week:

How do I remove jQuery? I’ve removed it from my template files but it still persists. I can’t seem to find a need for it on my site but it calls for it anyway. I tried deactivating the 3 plugins I’m using, but it still won’t go away. I’m basically using WordPress to post articles on my site and I’m not allowing posts from users so I can’t see where jQuery would be required.

How jQuery Makes it on the Page

Not every site needs jQuery for the front-end. If you’re just handling a single form, one or two animated elements, or listening for events in one sidebar module, jQuery could be overkill. It’s a rather large library that definitely makes scripting easier, but if you’re only using it for one feature I’d urge you to reconsider.

Once you’ve removed the jQuery dependency from your scripts, though, you’ll often still see WordPress loading up the library anyway. Why won’t it go away?

There are actually a few things that might keep jQuery around:

The toolbar – If you’re logged in to the site, whether your theme uses jQuery or not is inconsequential. That little toolbar at the top of the page? Yeah, it uses jQuery. I have it on good authority that the toolbar doesn’t always require jQuery 1, but some plugins you have installed will force it to load jQuery. If you have Jetpack installed, the comments notification and stats feature will use jQuery and require it, even on the front-end, to make the toolbar functional.

Plugins – If you’re not careful, you might have a plugin that still loads jQuery on the front-end. More developers are including AJAX routines in their form submission plugins these days. Poorly-coded plugins might still enqueue jQuery even if the AJAX features are disabled.

Theme enqueues – Even if you’ve removed the jQuery dependency in your code, you’ll also need to remove it from your enqueue. The wp_enqueue_script() function accepts a dependency parameter, which is an array of scripts that must be loaded before your script will work on the page. Even if your script never references jQuery, leaving array( 'jquery' ) in the function call will still force jQuery to be loaded on the page.

jQuery’s Disappearing Act

First, you’ll need to find out where jQuery is loading on the page. I recommend viewing your site in a new browser session – like Chrome’s incognito mode – to make sure jQuery isn’t appearing just for you as a site editor. You can right-click and view the page’s source, searching for ‘jquery’ to find where it lives on the page.

If you don’t find it, you’re done!

If you do find it, take note of which scripts follow jQuery on the page. There’s a good chance those scripts declare jQuery as a dependency. Take some time to look at them again and see if they really do need jQuery.

Plugin scripts you should leave be. Core scripts you should leave be as well. Don’t hack a 3rd party distribution over which you yield no control when it comes to updates.

Theme scripts – if it’s your custom theme – are A-OK. If it’s a 3rd party theme, try building a child theme on top of it and make the necessary script/enqueue changes in the child theme. This way, you’ll still benefit from updates.

The bottom line: you might actually need jQuery, so be absolutely sure you don’t before you try to get rid of it. If you really don’t need it on the front end, make sure you don’t have a script somewhere on your site claiming otherwise.

Notes:

The toolbar itself is just HTML and CSS. The only real scripted part is the scroll-to-top feature, which I wrote, and I know for a fact that it will work even in the absence of jQuery. ↩