时间戳

首页 > 解决方案 > WebP 不能在移动设备上运行，但可以在桌面上运行？

modernizr - WebP 不能在移动设备上运行，但可以在桌面上运行？

问题描述

我使用将我所有的图像转换为 WebP，gulp-webp并使用 Modernizr 检查是否启用了 webp，如果启用，则使用 webp url 创建一个新的 img 标签。据我在谷歌页面速度上看到的，它在桌面上按预期工作，但在移动设备上，它Serve images in next-gen formats仍然说。

您是否需要采取其他步骤才能使其在移动设备上运行？我在任何地方都找不到任何关于它的信息，我已经完全按照 Modernizr 所说的那样设置了 webp。

任何帮助，将不胜感激。

Modernizr.on('webp', function (result) {
    $('.noscript').each(function() {
        let img = document.createElement('img');
        img.alt = this.getAttribute('data-alt');
        img.className = this.getAttribute('data-class');

        if (result) {
            img.src = this.getAttribute('data-webp');
        } else {
            img.src = this.getAttribute('data-original');
        }

        this.parentNode.insertBefore(img, this.nextSibling);
    });
});

然后我会在 HTML 中执行此操作：

<noscript data-alt="Payment Logos" data-original="/images/common/payment-foot.png" data-webp="/dist/images/common/payment-foot.webp" data-class="mobileHide lazyload" class="noscript"> 
    <img src="/images/common/payment-foot.png" alt="" class="mobileHide">
</noscript>

标签： modernizrgoogle-pagespeedwebp

解决方案

推荐阅读