Advanced Search

Minify HTML, CSS and JavaScript to speed up web pages, reduce server load
By
03 February 2020 (Edited )
Share this article:

In my test the Minifier reduced pagefile size by 25.57%

Minify your web code for faster page loading

Results of testing web pages with Google webmaster tools like Lighthouse often include a recommendation to "minify" HTML, CSS or Javascript.

Following this recommendation makes perfect sense for both the site owner and users, because minifying page code reduces the size of the HTML files behind your web pages, which in turn reduces:

  • The time it takes the user's browser to download the page code
  • The time required for the browser to parse the page file and render a meaningful "paint" of the page layout and content
  • The load on your server
  • The user's data consumption
  • Negative assessments of your page on the part of Google

How does minifying work? A software program scans the code of your page, finds and removes white space and comments, and applies many other shortcuts in order to reduce the weight of your page file. And it does this very quickly.

Example:

I'm going to minify the code of one of our ACROGlobal.com pages using the HTML Minifier posted on Github by Juriy "kangax" Zaytsev, here: https://kangax.github.io/html-minifier/ which looks like this:

Our page on Direct Response Search Advertising is here: www.acroglobal.com/marketin...ism-search-advertising.htm

and looks like this:

To use the Minifier, I first viewed the source code of the ACROGlobal page in a browser window:

(There's much more, of course.)

Then, I copied all the source code, pasted it into the top pane of the Minifier, chose some options in the right column of the Minifier, and clicked Minify. Here's the minified version of the source code in the previous screencap - note the striking absence of white space and comments:

And here's the Minifier's report on the reduction in file size that occurred in that process:

The Minifier reduced the size of that file by 25%+ with about 10 seconds of work on my part.

And there are 20+ options in the right column of the Minifier that you can turn on or off by click boxes, to tweak the minification to satisfy your every whim.

Not bad. And free, too.

Share this article:

And if you have questions or comments, you can easily send them to me with the Quick Reply form, below, or send me an e-mail.


David Boggs MS    - David
David@DavidHBoggs.com
View David Boggs's profile on LinkedIn

Google Certifications - David H Boggs
View my profile on Quora
Subscribe to my blog

External Article: https://kangax.github.io/html-minifier/


Subhead In my test the Minifier reduced pagefile size by 25.57%
Website
Visit Website
Rating
5/5 based on 1 vote.
Show Individual Votes
Related Listings

Sorry, you don't have permission to post comments. Log in, or register if you haven't yet.

Please login or register.

Members currently reading this thread: