Ps：一、二主要解释一些专有名词，具体“ AMP 开发规范 ”可以直接参阅第三专题！

《 AMP 开发文档 》

一、框架组成：

谷歌AMP - HTML框架由 AMP HTML、AMP JS、AMP Cache 三大核心组件构成！

1.AMP HTML

AMP HTML 是为了 确保网页性能 的 具有 某些限制 的 HTML。

AMP HTML 本质上是使用自定义 AMP属性扩展 的 HTML。

尽管 AMP HTML 网页中的大多数标记都是常规 HTML 标记，但部分 HTML 标记替换为了 AMP 专用标记（另请参阅 AMP 规范中的 HTML 标记)。利用这些自定义元素（称为 AMP HTML 组件）可以轻松高效地实现常见的模式。

例如，amp-img 标记可提供完整的 srcset 支持，即使在尚不支持该标记的浏览器中也是如此。

2.AMP JS

AMP JS 库可确保快速渲染 AMP HTML 网页。

AMP JS 库 可实现所有 AMP 的最佳性能做法、管理资源加载，并为您提供上面提到的自定义标记，所有这些都是为了确保快速渲染您的网页。

最重大的优化之一就是它可使来自外部资源的所有内容保持异步，让网页中的任何内容都能毫无阻碍地渲染。

其他性能技术还包括：将所有 iframe 沙盒化，加载资源之前对网页上每个元素的布局进行预先计算，以及禁用性能缓慢的 CSS 选择器。

3.AMP Cache

Google AMP Cache 可用于提供缓存的 AMP HTML 网页。

Google AMP Cache 是一种基于代理的内容交付网络，用于交付所有有效的 AMP 文档。它可提取 AMP HTML 网页，对这些网页进行缓存，并自动改进网页性能。使用 Google AMP Cache 时，文档，所有 JS 文件及所有图片都从使用 HTTP 2.0 的同一来源加载，从而可实现最高效率。

此外，Google AMP Cache 还带有内置验证系统，可确认网页能够正常工作，并且不依赖于外部资源。此验证系统运行一系列断言，确认网页的标记符合 AMP HTML 规范。

Google AMP Cache 可以理解为谷歌官方提供的免费CDN服务。

二、运作原理：

01.仅允许异步脚本

02.静态确定所有资源的大小

03.不让扩展机制阻塞渲染

04.将所有第三方 JavaScript 保存在非关键路径下

05.有 CSS 都必须内嵌并具有大小限值

06.字体触发必须高效

07.最大程度减少样式重新计算次数

08.仅运行 GPU 加速动画

09.设定资源加载的优先级

10.瞬时加载页面

三、开发规范：

1.AMP页面源码 必须包含的标记

• 必须以“

• 必须包含顶级标签：“

• 必须包含“

• 必须包含“”标签，且作为其头标记的第一个子标记！

• 必须包含“”！

• 必须包含“”标签！

• 必须包含“

  ”标签！

• 必须包含AMP样板代码（head > style[amp-boilerplate]和noscript > style[amp-boilerplate]）：

以上八个“必须”必须严格遵守！

2.AMP HTML 规范

01.HTML 标签

• 禁止添加“