自采用 Google AMP (amp-img) 以来,Google PageSpeed 惩罚“延迟离屏图像”。似乎 PageSpeed 鼓励 AMP 加载所有图像!在 AMP 之前,我使用 JS 来延迟加载位于初始视口之外的图像。我愿意接受有关如何保留 AMP 但避免 PageSpeed 惩罚的建议。
示例:(此图像的代码位于初始视口下方,靠近页面底部)
::: 页面顶部区域 - 初始视口区域 ::: ...“折叠”页外、折叠下方、靠近底部页面的第二个视口页面
当在 PageSpeed 上评分时,尽管此图像不在页面上,但 AMP 运行时不会延迟加载并导致罚分!
(代码被删除,因为 StackOverflow 编辑器拒绝允许它!)
由于 AMP 禁止我的旧 JS LazyLoad 技术,我受制于这种声明的 AMP 行为:“运行时可能会根据视口位置、系统资源、连接带宽或其他因素选择延迟或优先加载资源。” (https://amp.dev/documentation/components/amp-img?format=websites)所以看来,通过采用 AMP,我已经放弃了对 Google AMP 运行时延迟加载的控制,这“可能”选择延迟。当 PageSpeed 对 AMP 页面进行评分时,您会认为 AMP 运行时想要给人留下深刻印象,对吧?您会认为 AMP 运行时会“选择延迟”(amp-img) 内容出现在页面外(不在初始视口区域内)。你错了。
PageSpeed 惩罚信息如下:
“推迟屏幕外图像。考虑在所有关键资源完成加载后延迟加载屏幕外和隐藏图像,以缩短交互时间”
我喜欢 AMP,但是 PageSpeed 的人有机会与 AMP 的人合作吗?我同意 PageSpeeds 对这种情况的描述,称其为“机会”。可悲的是,当我采用 AMP 时,我似乎已经将这个“机会”交给了 AMP 运行时......并因此而受到惩罚。
任何人都可以提供一个实用的解决方法,以便我可以保留 AMP,但在将 (amp-img) 用于位于初始视口之外的图像时不会在 PageSpeed 上受到惩罚?