Why & How to minify CSS & JavaScript files in Wordpress

blog cover image
15
6.8K followers

Let's start with the obvious question: what is minification and why is so important?

To put it shortly: minification is a method that will allow you to make your website file(s) smaller, by removing empty lines, white spaces, unnecessary characters, etc from the original source code of your webpage.

The goal is to eliminate any unnecessary bytes from the source code by deleting extra spaces, indentation and line spaces while maintaining the readability of the code. The process will reduce the overall size of your website core and front-end files. It's recommended/used for HTML, CSS and Javascript files that are sent to user’s browsers.

The most important benefit is obvious: compact files are faster to load and the result is better page speed. But there are many other benefits: reduced network latency, fewer HTML requests, enhanced compression, faster parsing, browser downloading and execution ...

And many "experts" will tell you that the actual performance improvement is very small and not worth the trouble ... I strongly disagree! Yes, there are many other optimization factors that can give you an even bigger boost ... For example, image optimization ... Still, when it comes to speed optimization, we are talking about a LOT of different factors and the final, cumulated effect is the result of many small improvements!

And believe me, it may seem a small tweak, but minifying your code can actually drastically improve your loading time! The proof? You simply can't achieve a 100/100 score on GTMetrix, Google Pagespeed or other speed testing platforms without minifying your HTML, CSS and JavaScript code.

This is is why I've decided to create this short tutorial where I will show you how to easily minify your HTML, CSS and Javascript files in order to improve the performance and the speed of your Wordpress website.

Interested?

Here it is:

Why & How to minify CSS & JavaScript files in Wordpress

Enjoy it!

Login
Create Your Free Wealthy Affiliate Account Today!
icon
4-Steps to Success Class
icon
One Profit Ready Website
icon
Market Research & Analysis Tools
icon
Millionaire Mentorship
icon
Core “Business Start Up” Training

Recent Comments

22

Hi Zed, I will definitely look at doing this on my site, thank you for making me aware and for the training, Alan.

Thank YOU!

Thanks Zed. This is a technical feature I would never have thought of, not being a programmer.

Thank YOU!

Here is something I really needed, thanks!

Happy to help :)

Hey Zed,
Thanks for this. I've been playing with various minification plugins as using WA's Extreme setting for SiteSpeed breaks my menus on my site for Chrome and Safari browsers. My speeds were amazing but the functionality suffered.

Setting it to Accelerated works but my speeds were showing to be in the mid 60's to 70's.

Google's insight complained about render blocking resources.

Adding this plugin and enabling it brought the desktop numbers to the 90's but the mobile are still hovering in the 70's.

I'm cautious of using plugins that are no longer maintained but you did say it still works and my results show that to be true.

My question is this... Are there other plugins such as Autoptimize, Fast Velocity Minify and so on that you'd think would be comparable or better?

Thanks,
Scott

Hi Scott,

Thanks for your feedback!

Yes, Autoptimeze is also an excellent tool. And for render blocking issues you could try Async JavaScript.

You'll find the download links in my speed optimizitaion guide:

Thanks!

Any time!

So, does this one plugin replace the other two or is this a mix and match solution?

Usually, the best combination is Autoptimeze + Async JavaScript.

OK, I'll give that a try and remove BWP.

Thanks again,
Scott

My pleasure :)

Well, using the 2 in conjunction seemed to break a lot of my javascript stuff....I went back to just using BWP.

Sorry to hear that Scott ... But this is the game ... Each site has different settings/plugins/theme/etc and we need to find the optimal solutions.

So true

Thank you Zed

Thank YOU!

Thanks for sharing, Zed.

Thanks for the time Roger!

No problem, Zed.

See more comments

Login
Create Your Free Wealthy Affiliate Account Today!
icon
4-Steps to Success Class
icon
One Profit Ready Website
icon
Market Research & Analysis Tools
icon
Millionaire Mentorship
icon
Core “Business Start Up” Training