HTML performance features - Learn web development 编辑

• Previous
• Overview: Performance
• Next

Draft

This page is not complete.

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> 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.

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>
• <object>
• <script>
• relattribute

Conclusion

• Previous
• Overview: Performance
• Next

In this module

• The "why" of web performance
• What is web performance?
• How do users perceive performance?
• Measuring performance
• Multimedia: images
• Multimedia: video
• JavaScript performance best practices.
• HTML performance features
• CSS performance features
• Fonts and performance
• Mobile performance
• Focusing on performance

See also

• 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/ )