Minimizing scripts & css files that plugins add

Question

I try my best to limit plugin usage and only use ones that are well designed. But I still find that many will load a lot of extra scripts and styles, and few have options to load selectively based on whether the plugin is being used.

I have started doing things like deregsitering the plugin scripts and them combining them one file and including it again myself, or using an if statement somewhere in the plugin file to only load it on certain page. But this can be a problem when the plugins are updated.

Is there a plugin that provides an easy interface to enqueue/dequeue all registered scripts and styles? If not, is there a better way to do it than what I've been doing?

Answer 1

I would suggest using a minify plugin that will automatically combine all the scripts and styles for you. Here are a few that will do it for you:

http://wordpress.org/extend/plugins/w3-total-cache/
http://wordpress.org/extend/plugins/bwp-minify/
http://wordpress.org/extend/plugins/wp-minify/
http://wordpress.org/extend/plugins/minify/

Answer 2

Instead of modifying the plugins directly, you can create a functionality plugin and include all of the dequeue statements in there. That way you they won't be overridden when you upgrade the plugins.

The biggest thing to keep in mind is to make sure that you time things correctly. You have to make sure you call wp_dequeue_script() after the other plugin calls wp_enqueue_script().

For example, say a plugin loads a script like this:

function foo_enqueueScripts()
{
    wp_register_script(
        'foo_uselessEyeCandy',
        plugins_url( '/js/useless-eye-candy.js', __FILE__ ),
        array( 'jquery', 'jqueryUI' ),
        FOO_VERSION,
        false
    );

    wp_enqueue_script( 'foo_ueslessEyeCandy' );
}
add_action( 'wp_enqueue_scripts', 'foo_enqueueScripts' );

...then you can dequeue it like this:

function bar_removeExtraScripts()
{
    wp_dequeue_script( 'foo_uselessEyeCandy' );
}
add_action( 'wp_enqueue_scripts' 'bar_removeExtraScripts', 11 );

Notice that you're hooking into the same hook -- wp_enqueue_scripts -- that the plugin used, but with a higher priority -- 11 -- so that it will run after the plugin calls wp_enqueue_script().