1. Minify HTML

In a normal webpage there is a lot of whitespace. We put it there in form of tabs and carriage-returns in order to make the document more maintainable and easier to read. But it has its price in terms of adding to the overall weight of the document in kilobytes and it takes longer for the browser to render a page with a lot of whitespace.

By getting rid of all the extra whitespace in the HTML you can save up to ~25% of the total weight of the page in kilo bytes and make rendering in the browser faster. It's a double-win.

Minifying HTML has the same benefits as those for minifying CSS and JS:

  • reducing network latency,

  • enhancing compression,

  • and faster browser loading and execution.

Moreover, HTML frequently contains inline JS code (in < script > tags) and inline CSS (in < style > tags), so it is useful to minify these as well.

Guidelines:

This online HTML compression tool will save space in your HTML files and make them much smaller by doing the following:

  • Removing text line breaks from the code

  • Removing tab spaces

  • Replacing double spaces with single spaces

Example:

Before

Before Minifying HTML

After-Minifying the following HTML resources could reduce their size by 436B (43% reduction).

After Minifying HTML