How to minify CSS and JavaScript Files

0
238

Do you want to minify files of your website ? You can make faster your site loading speed by minifying CSS, JavaScript, php. Mostly, we see a warning for non-minified files on website when we check Site SEO or loading speed. So, In this article we are going to tell you that how you can minify Your Web Files to improve your site loading speed.

What is Minify and When do you need it?

The term minify is used to describe the method in which we minimize size of our files like Html,CSS, JavaScript. We can minify CSS/javascript by removing unnecessary whitespaces,lines and character from source codes.

Usually it is recommended to be used only for files that are sent to user’s browsers. it includes Html, CSS, JavaScript. We can also minifyPHP but PHP is server-side script. So, Minifying PHP can’t improve anything.

The process minify is not complex as you think. it is very easy to minify our files. To minify CSS/JavaScript we need to remove unnecessary lines,White-spaces, and characters. So we have given a tutorial to minify our files.

Here is an example of  the normal CSS file.

body {
margin:20px;
padding:20px;
color:#333333;
background:#f7f7f7;
}
h1 {
font-size:32px;
color#222222;
margin-bottom:10px;
}

This code includes unnecessary white spaces, lines, and character. So when our browser reads these codes then browser also reads these unnecessary lines, spaces. So in result, it takes more time to render on the browser.

if we minify CSS code it means if we remove unnecessary white-space and lines from these codes. Then codes look like this.

body{margin:20px;padding:20px;color:#333;background:#f7f7f7}h1{font-size:32px;margin-bottom:10px}

This code doesn’t include any White-Spaces, unnecessary lines so browser has to read only necessary contents. So it takes less time than non-minified files. So it can render faster in the browser.

How to minify JavaScript?

Here is a non-minify code of javascript.


function myMethod(){
var x=10;
var y=20;
var z=x*y;
return z;
}

and minify code for JavasScript looks like this


function myMethod(){var x=10,y=20,z;
z=x*y;return z;}

Finally, we have known that how we can minify CSS/JavaScript.

I hope this article will be helpful to you. If you like this article share it with your friends.

We are waiting for your suggestion.

Thanks,

SHARE
Previous article8 Easy Tips To improve Site Loading Speed
Next articleHow to Enable Hibernate Option in Windows 8/10
Hello, I am passionate about blogging and this is my hobby to share information to people that make a sense and work for people to save their time and money and increase their information. I always share here Technology, Make Money Tricks, Mobile, Computer and many Such Information.

LEAVE A REPLY

Please enter your comment!
Please enter your name here

This site uses Akismet to reduce spam. Learn how your comment data is processed.