占位符 & 回退
本着感知性能和渐进增强的精神，在 AMP 中尽可能提供占位符和回退是最佳实践。
一些元素甚至会因为你这样做而放宽限制——例如，如果你为 amp-iframe 提供占位符，它就可以在页面顶部附近使用（如果没有占位符则无法使用）。
占位符
带有 placeholder 属性的元素充当父 AMP 元素的占位符。如果指定，则 placeholder 元素必须是 AMP 元素的直接子元素。标记为 placeholder 的元素将始终 fill 父 AMP 元素。
<amp-anim src="/static/inline-examples/images/wavepool.gif"
layout="responsive"
width="400"
height="300"
alt="...">
<amp-img placeholder
src="/static/inline-examples/images/wavepool.png"
layout="fill"
alt="...">
</amp-img>
</amp-anim>
默认情况下，即使 AMP 元素的资源尚未下载或初始化，也会立即显示 AMP 元素的占位符。准备就绪后，AMP 元素通常会隐藏其占位符并显示内容。
注意 – 占位符不必是 AMP 元素；任何 HTML 元素都可以充当占位符。
回退
你可以在元素上指定 fallback 属性，以指示回退行为
- 对于浏览器不支持的任何元素
- 如果内容加载失败（例如，Tweet 已删除）
- 如果图像类型不受支持（例如，并非所有浏览器都支持 WebP）
你可以在任何 HTML 元素上设置 fallback 属性，而不仅仅是 AMP 元素。如果指定，则 fallback 元素必须是 AMP 元素的直接子元素。
示例：不支持的功能
在以下示例中，我们使用 fallback 属性来告知用户浏览器不支持特定功能
此浏览器不支持视频元素。
<amp-video controls
width="640"
height="360"
layout="responsive"
src="/static/inline-examples/videos/kitten-playing.mp4"
poster="/static/inline-examples/images/kitten-playing.png">
<div fallback>
<p>This browser does not support the video element.</p>
</div>
</amp-video>
示例：提供不同的图像格式
在以下示例中，我们使用 fallback 属性来告诉浏览器，如果不支持 WebP 格式，则使用 JPEG 文件。
<amp-img alt="Mountains"
width="550"
height="368"
layout="responsive"
src="/static/inline-examples/images/mountains.webp">
<amp-img alt="Mountains"
fallback
width="550"
height="368"
layout="responsive"
src="/static/inline-examples/images/mountains.jpg"></amp-img>
</amp-img>
占位符和回退的交互
对于依赖动态内容的 AMP 组件（例如，amp-twitter、amp-list），回退和占位符的交互方式如下
- 在内容加载时显示占位符。
- 如果内容加载成功，则隐藏占位符并显示内容。
- 如果内容加载失败
- 如果有回退元素，则显示回退。
- 否则，继续显示占位符。
隐藏加载指示器
许多 AMP 元素都被列入允许显示“加载指示器”的白名单，这是一个基本动画，表明该元素尚未完全加载。元素可以通过添加 noloading 属性来选择退出此行为。