Last time we took a look at the performance impact of using tabs vs. spaces in HTML files. One question that arose was whether or not it’s worthwhile to minify HTML when also using GZip. Let’s run the experiment.

I’ve collected a few real-world HTML files and done some minification and GZipping on them. Here’s the result:

Website	File size	Minified	Gzip	GZip & minified	Savings
amazon.com	218,642	197,032	53,793	49,008	9%
cnn.com	130,014	121,534	27,114	25,392	6%
twitter.com	53,465	46,608	12,262	11,416	7%
xbox.com	38,888	24,139	8,075	6,795	16%

These pages already do minification on various sections, but none of them minifies the whole document. If none of them used any minification, the savings would have been higher than the table shows.

So, according to the results, minification will provide an additional 6-16% lower file size with GZip enabled.

16% is a rather large saving on top of regular GZip, so the data suggests that we must use both GZip AND minification.

Remember, this is a rather small experiment with only 4 real-world websites. It would be interesting to expand the experiment for more accurate statistics.

For HTML minification in ASP.NET, I like to use WebMarkupMin or Meleze.Web.

Are you using tabs or spaces to indent your markup? Does it matter for performance which one you chose? Let’s run an experiment.

Consider a page that generates a list of 50 items:

<ul>
    @for (int i = 0; i < 50; i++)
    {
        <li>The count is @i</li>
    }
</ul>

The code generates a long list of <li> elements and keep their indentation using the editor’s settings for tabs, spaces and tab size. Default in many editors is spaces and a tab size of 4.

With spaces it looks like this:

and with tabs it looks like this:

It’s clear to see that the indentation takes up 4 characters when spaces are used and only a single character when using tabs. If we then compare the total file size of the two variations, here’s what we get:

	Tabs	Spaces	Saving
Raw file size	1403 bytes	1703 bytes	300 bytes/18%

Using tabs saves close to 18% of the file size over spaces.

This is, however, not a true picture of a web page. All modern web servers use compression in form of GZip or Deflate before serving HTML to the browser. So let’s look at the numbers after GZip:

	Tabs	Spaces	Saving
Raw file size	1403 bytes	1703 bytes	300 bytes/18%
Raw file GZipped	327 bytes	332 bytes	5 bytes/1.5%

When using GZipping, the saving from using tabs over spaces is just 1.5%. It’s still a saving and it counts.

Yet again, this is not the complete story because some web developers make sure to minify the HTML by removing redundant whitespace, unneeded quotation marks etc. Normally this is done as a build step or at runtime.

So let’s minify the HTML and see what results it produces:

	Tabs	Spaces	Saving
Raw file size	1403 bytes	1703 bytes	300 bytes/18%
Raw file GZipped	327 bytes	332 bytes	5 bytes/1.5%
Raw file minified	1199 bytes	1199 bytes	0 bytes/0%
Minified & GZipped	312 bytes	312 bytes	0 bytes/0%

When minified, it doesn’t matter if tabs or spaces are used, since they are all stripped away.

Conclusion

Depending on the capabilities of your server, build setup, runtime etc., here’s a little chart of what to do based on the above findings:

	Use tabs or spaces
I can minify	Doesn't matter at all
I can GZip but not minify	Doesn’t matter much (tabs gives small benefit)
I can neither GZip nor minify	Tabs

Keep in mind that this is a controlled experiment, so your mileage will vary.

If you want to enforce your entire team to use either tabs or spaces, then take a look at .editorconfig. There’s a plugin available for practically all editors.

In the next segment, we look at the effects of GZipping vs. minifying HTML files.