WordPress combine plugin CSS and JS

November 30, 2015

If you’re like me, you probably have at least one WordPress site with at least 5 plugins. Honestly, I have about ten different WordPress sites. Some of them have over 10 plugins. While all this functionality is great, it comes at a cost!

The Problem

You see, each plugin typically brings with it at least one CSS file and one JavaScript file. So, if your WordPress site has 10 plugins, that’s 10 additional CSS and JS files.

The problem here is with the way HTTP works. To over-simplify, the more requests your website needs to load, the slower it’s going to be. For this reason, custom developed sites typically minify and concatenate all of their CSS and JS files together so they only have one CSS request and one JavaScript request.

The problem is we can’t really do that with a WordPress site because we can’t control the CSS and JS that plugins use. They update frequently so it would not be a good idea to copy the contents and paste them into your giant concatenated file.

The Solution

Fortunately, as is usually the case, there is a great free plugin available to do just that for us! It’ll check all your plugins, take the up to date CSS and JS and stick it all in one minified concatenated bundle!

Check out the difference having done nothing but install Better WordPress Minify.

Before (54 Requests)

Screen Shot 2015-11-28 at 7.29.33 PM

After (36 Requests)

Screen Shot 2015-11-28 at 7.30.02 PM

I think that’s a pretty great win for just installing one plugin!

Go out, download Better WordPress Minify and speed up your site!