In the last chapter we briefly saw how to fix validation errors with amp-img by adding layout="responsive" to the image element, but there wasn't much explanation about what was happening. When we added the layout attribute, we were tapping into AMP's powerful layout system.
Laying out elements in AMP pages
The AMP-HTML layout system
AMP's layout system is key to reducing rendering and scrolling-jank. AMP uses a static layout system that relies on a set of attributes to define the layout and sizing of elements. These are layout, width, height, sizes, and heights. With these attributes, AMP is able to efficiently calculate the layout and size of each element even before anything is fetched from the...