ag游戏平台手|首页据统计,40%的人会放弃使用加载时间超过3秒的网站。对于加载慢的页面我也是没耐心等待的,同类型网站那么多,为什么不选择加载速度更快体验更好的呢。为了解决网页加载慢的问题,Google联合数十家技术机构和企业等推出了移动网页加速项目(Accelerated Mobile Pages, AMP)。

据<>

不明觉厉,接下来让我们一起来揭开AMP神秘的面纱吧。

一、什么是AMP?

Accelerated Mobile Pages (AMP)直译过来就是在移动设备上快速加载的网页。它是由 Google 发起的一个开源项目,主要目的是缩短静态内容的渲染时间从而有效提升网站的加载速度。

那么问题来了,AMP的加载速度到底有多快?

根据 Google 官方说明,AMP 在模拟 Nexus 5 并模拟 3G 网络的测试情况下,首屏展现速度有 15% ~ 85% 的提升。

这么NB,让我们来看看AMP到底什么鬼。

AMP主要由三个部分组成:

1.AMP HTML

1).AMP HTML 规范

AMP HTML 在 HTML 的基础上加了一些使用限制,并且添加了AMP自定义的组件。

AMP 禁用部分 HTML 标签如?

?等。

部分 HTML 标签必须使用 AMP 自定义的组件来替换如??、??用??、?替换。

AMP在HTML基础上也提供一些扩展组件,如??、??、??等,但是使用扩展组件时必须引入相应的JS文件。

一个简单的 AMP HTML 示例:

将上面的代码保存为?.html?文件,在浏览器中就可以正常运行,从这个示例可以看出,AMP HTML 的写法和HTML差不多,但是又有自己的规范要求:

  • DTD 必须是:?
  • 顶层标签必须包含 AMP 属性如:?,方便其他程序识别 AMP HTML;
  • 必须在 HEAD 区域中放置??标签,指定该页面普通版本的 URL;如果只有一个版本,则使用当前 URL;
  • 必须将??放置在 HEAD 区域最开始的位置;
  • 必须在 HEAD 区域包含这个 ViewPort:
  • 必须将??作为 HEAD 区域最后的元素;
  • 必须在 HEAD 区域包含上面示例所示的?