iPhone 6 / iPhone6 Plus 上的 Wordpress 图像渲染问题

问题描述

我们有一个包含 20 个 .svg 图像的页面。对于我们测试的所有设备,页面在第一次加载时完全正常,但特别是 iPhone 6 和 iPhone 6 Plus,一旦我们将页面滚动到底部或顶部,一些快速的图像消失了,重新渲染它需要时间我尝试了几种不同的解决方案,但似乎都不起作用。我真的很感激一些帮助。

我遇到问题的页面https://transform.makeen.io/forms

来自 iPhone 6 的视频:

https://youtu.be/XPQza2fDzjs

来自 iPhone 8 的视频:

https://youtu.be/OKbTUORQAG4

谢谢

解决方法

这可能与 loading="lazy" 相关。由于 Wordpress 5.5 默认情况下 loading="lazy" 应用于图像,因为它成为本机浏览器行为。

我们可以通过在您的 wp_lazy_loading_enabled 中使用此过滤器 function.php 挂钩过滤器来禁用此本机行为。

add_filter( 'wp_lazy_loading_enabled','__return_false' );

根据 Can I Use,对属性 loading="lazy" 的支持仍然只有 72.72%

IE 边缘 火狐 Safari IOS Safari
不支持 支持 部分支持 支持 不支持但可以启用 不支持但可以启用

如您所见,IOS 默认不支持它,这可能会导致一些加载问题。

如果您继续这样做,我建议您切换回老式的延迟加载方法或页面转换加载器。


了解详情