Last Updated: February 25, 2016
·
1.332K
· grayghostvisuals

Reducing the file size of HTML documents

Why Fast?

Performance is one of the main keys to the success or failure of your Web App or Website. Unfortunately, slow performance can become one of the brand values associated with a site by its users. Fortunately, we as the authors can do something about this.

Authoring Consistent Markup

Authors are encouraged to write consistently with their markup by using attributes on elements in the same order, write in lowercase and use consistent quotation throughout their codebase. By following these steps authors can achieve the best compression out of the gzip algorithm.

Minimize the size of the DOM

A large number of HTML elements means a slower download, slower calculation of CSS selectors and slower JavaScript DOM manipulation. Hundreds of DOM elements is acceptable, but thousands will require some optimization.

You can check the amount of elements within your web inspector console by entering:

document.getElementsByTagName('*').length

Strip Out Dead Code

According to the HTML 4 DTD, authors can omit closing tags with the following HTML elements:

  • <body>
  • </body>
  • </colgroup>
  • </dd>
  • </dt>
  • <head>
  • </head>
  • <html>
  • </html>
  • </li>
  • </option>
  • </p>
  • <tbody>
  • </tbody>
  • </td>
  • </tfoot>
  • </th>
  • </thead>
  • </tr>

Further Research

Google Speed Documentation

2 Responses
Add your response

Can I omit this closings tags in HTML5 too?

over 1 year ago ·

Even in HTML5 my good man.

over 1 year ago ·