加速移动页面-动态页面

Question

我对新的AMP印象相当深刻，并希望在我的移动网站上实施它。我的移动网站上的大部分内容都是动态的，这意味着根据登录用户的不同，它将从不同的后端服务，如mysql和sphinx获取数据，并呈现结果。

我可以为我的移动网站使用AMP吗？在Google上做了一些搜索后，我发现人们在静态页面上推荐它。另外，CDN缓存技术如何在AMP中为动态页面工作。

Answer 1

您可以使用amp-list组件嵌入用户特定的动态内容(docs、sample)。名称amp-list有点误导，因为您也可以将其用于单个项目。如果您的AMP是通过缓存加载的，这也会起作用。

另一种可能是使用iframe。

Answer 2

我还想知道动态页面的缓存是如何工作的，我在AMP Github上发现了一个问题，它基本上解释了Google缓存在http头文件中遵守Cache-control max-age属性，以评估缓存何时必须更新。唯一不起作用的是将其设置为0。

但看起来他们正在研究一种解决方案，以编程方式清理缓存。

这是AMP GitHub的相关页面：https://github.com/ampproject/amphtml/issues/1901

Answer 3

您可以将AMP用于动态站点。因为我们在使用AMP插件的WordPress网站上使用AMP，即一个动态网站。

您需要前往官方网站并遵循入门指南：https://www.ampproject.org

我添加了几点，我已经学到，创建几个AMP页面和模板到目前为止。

由于您有自己的自定义网站，您需要自己实现和创建AMP页面或AMP模板，其中有两个要点需要考虑：

1. 您的普通页面将在标题中有一个链接，指定它有可用的AMP版本的页面，具有以下标记：

<link rel="amphtml" href="exact-url-to-you-amp-version-of-this-page" />

1. ，然后您将创建该页面的AMP版本，它与rel=canonical具有类似的链接，以避免重复惩罚，即AMP版本将具有以下链接：

<link rel="canonical" href="exact-url-to-your-original-non-amp-page" />

这就搭好了舞台。现在AMP页面需要遵循非常严格的格式，即不允许使用样式表、脚本或img标记。https://github.com/ampproject/amphtml/blob/master/spec/amp-html-format.md#html-tags

你可以使用这个基本的模板开始，因为有几个其他的标签，你需要在页眉中，如AMP在HTML标签中的符号，以声明它是AMP页面。然后按照所有规则在此页面上构建动态内容部分，即img标签使用amp-img标签，不使用iframe，不在html标签上使用内联样式。没有外部样式表..即内联css样式、规则等https://www.ampproject.org/docs/get_started/create/basic_markup.html

此外，您还可以通过添加#development=1到URL并查看Chrome控制台中的任何错误来验证您创建的AMP页面。更多信息请点击此处：https://www.ampproject.org/docs/guides/validate.html