HTML performance features

HTML is by default fast and accessible. It is our job, as developers, to ensure that we preserve these two properties when creating or editing HTML code. Complications can occur when, for example, the file size of a [<video>](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/video) embed is too large, or when a webpage is not optimized for mobile devices. This module intends to walk you through the key HTML performance features that can drastically improve the quality of your webpage.

Untitled

Elements & attributes impacting performance

• The <picture> Element

• The <video> Element

• The <source> Element

• The <img> srcset attribute

  • Responsive images

• Preloading content with rel="preload" - (https://w3c.github.io/preload/ )

• async / defer attributes

• [<iframe>](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe)

• [<object>](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/object)

• [<script>](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script)

• [rel attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel)