Thursday , November 21 2024

JS and CSS Minification

What is CSS, JS, and HTML minification?

The term “minify” is programming lingo that describes the processes of removing unnecessary characters in the source code. These characters include white spaces, line breaks, comments, and block delimiters which are useful for us humans but unnecessary for machines. We minify the files of a website containing CSS, HTML, and Javascript code so your web browser can read them faster.

To minify CSS, JS, and HTML involves removing any unnecessary characters from within a file to help reduce its size and thus make it load faster.How fast your site loads is not only important for first time visitors, but it is also important for moving search engine ranking.

Before Minification

 p {
    font-size: 14px !important;
}
ul li {
    font-size: 14px !important;
}

After Minification

p,ul li{font-size:14px!important}

How to minify your files?

There are many tools available for performing CSS, JS, and HTML minification.

refresh-sf.com (HTML, CSS and JS) – This compressor will minify JavaScript, CSS and HTML code types. It also includes all the compressor options for each code type if you need them.

Minifying via WordPress Dashboard

  • Log in to your WordPress Dashboard and navigate to Appearance.
  • Click on the Appearance menu and go to the Editor tab, then open the function.php file.
  • Now, copy this Minifying Code and paste it to your function.php file.
  • Click the Update File button at the bottom of the page, and it’s good to go.