Minify HTML code

Question

It is normal to see minified Javascript files, for performance gain.

Today we see some sites that minify everything, including the code itself HTML, as an example east of here. (use the option to display your browser’s source code)

Based on that, I ask: Really worth the trouble to minify the HTML file?

If yes, to what extent the work of minifying the file exceeds the lost performance?

If the site is not available, the minification I refer to, is simply removing the spaces, and not "transforming" the code.

Answer 1

First, minification is an act of transformation. If someone does not know, transforming is changing, changing the form. There is no definition of what you are referring to. What changes is transformed.

Second, this is a question of good practice. It may not contain the words, but this is what you ask. I start by saying it depends on the case. I will put general lines here, but each case needs to be analyzed as unique and the decision should be made with real data for that situation.

Several times I saw the situation not to be expected or even change. I’ve participated in project that started well minifying and then with a different traffic pattern had to turn off to get better result.

I will consider that the used minificador has quality.

HTML static

Of course, minifying a static HTML, as well as JS CSS, is always advantageous. You do the process once and have the win every time it is used.

So this is another one depends. Will the page be static? (doesn’t mean immutable) Check it out. Even though HTML allows a smaller minification than JS or CSS allows, there is still gain.

Is it hard to do this? If you know what you are doing, none in particular. Of course you have to organize everything. You have tools that help. But if the person arrived to worry about this, decided to analyze the data, automate the process will be the least.

Consider as static HTML pages used with technology SPA.

But I use data compression on the server

The compression really done the right way really makes it unnecessary to use minification (everything, not just HTML). But we can’t always guarantee that the compression will be made. We may use a server that does not have this capability enabled, or be communicating with a browser that does not have the ability to receive the compressed files. In these cases minification helps.

Even in cases where compression is active, there will be more gain with minification, very little, but will.

HTML Dynamic

When we talk about dynamic pages (created on demand) the thing already gets more complicated. It depends on many factors and I cannot list them all. You can go through the traffic pattern, the server processing capacity and the idleness of the server, whether there is traffic restriction or the cost is too high, whether the pages usually remain too cached or not, whether the web application server helps or not, etc.

The biggest gain when thinking about traffic is usually the compression performed by the web server according to the browser. If this is not possible, the minification helps. It decreases the amount of traffic and can slightly reduce the page load time (usually other factors are more important).

To minify all pages before leaving the server there is a processing cost. It is very common to need a more powerful server to run this well that has higher monetary cost, it is common to be higher than the gain that will have to decrease traffic.

Another cost is time to process minification. You gain time by moving less data, but lose preparing it.

How to know when is the point that pays? Only by measuring. It is common not to compensate, but I do not affirm this for all situations.

Nor will I speak of cases that may have won, but it be irrelevant. And most cases are irrelevant, so make the simplest.

In dynamic pages it is customary to turn off until the compression that can give more gains. Imagine if the minification, which usually costs more and has lower results, will compensate.

How the minification works

Understand that the process of minification goes through a page analysis, it is necessary to do at least one lexing, and probably a Parsing basic or more complete. Even if you want to take out only the spaces you need to understand each part of the code to not take out spaces from where you should not.

Of course, taking out only spaces will have a shorter processing, but it will also have fewer gains. A more complete minification may take a little longer to process, but will generate a stream minor.

Done the Parsing, Why not treat every possible situation? The bulk of the cost is to go through the archive, the generation of the minified to a greater or lesser degree will change little the total processing cost (unless you intend to do a more "intelligent" analysis and cut to the extreme).

Which pays more? I don’t know. No one can say this without the real case. A statement to one side or the other will sound like "good practice".

I think if I’m gonna minify it, I’m gonna do the best I can, but I wouldn’t apply this without looking at the real case. I’ll guess that minifying little makes up for very little, or nothing. Better minify with all the potential that is available.

At the same time that in these cases of dynamic pages, it is almost certain that I would not minify, except during the page generation itself, when this is relevant.

I don’t know if we can call minification the generation of the already minified page, but surely the generated result will be minified. When a page is generated on-the-fly It is possible, in some circumstances, already to generate his body very dry, after all it will not interest for any human. Of course there are cases where the generation will be made on top of templates written by humans, in these it is perhaps interesting to minification in the jig. This seems to be a more appropriate technique in these cases, but I will not go into detail because it does not seem to be the focus of the question.

Completion

Look at your case, follow up. If you think it doesn’t pay to do this, then follow the static HTML rule and the dynamic rule should not. If you think anything can be too much work, then stop worrying about it, in fact the gain is not exceptional and will only bring real advantages on websites of great movement.

I don’t know how the sample page was generated, so I don’t know if they did the best or not. Even if it’s dynamically generated, I can generate it minified and compensate. Whether it’s worth the work I’m going to have to do this depends on the specific use case.

The essence of this question has already been answered in Compilation/Minification of HTML, CSS and class names, what makes me think that the question is in fact duplicate (after all reading the answers posted there, clarifies the doubt posed here).