什么是旧的又是新的

关于那些曾经足够记住拨号上网的人来说，渐进式JPEG在90年代十分受欢迎，特意是由于咱们处置的是慢速互联网衔接。咱们当天经常使用它们的关键要素是为那些移动或乡村地域等较慢衔接的人提高功能。

为什么要经常使用渐进式JPEG？

渐进式JPEG的一个显著长处是存在感知功能优化。用户可以预览图像在下载实现之前的样子。此外，图像占用您网站的规划和空间加载速度更快，使整个环节觉得更快。渐进式JPEG理论也比非渐进式JPEG小，即使最终图像在视觉上是相反的。

关键的是要记住，渐进式JPEG会占用更多的CPU期间和内存来启动编码和解码，由于图像数据会被屡次解析。因此，只管它确实可以让您更快地启动预览，但解码的总期间或者会凑近2.5倍。

Liquid中的过滤器和格局选项

经常使用Liquid的过滤器，您可以传递图像的格局选项。它看起来像这样：

{{product|img_url:'800x800',format:'pjpg'}}

只有将您想要的格局选项传递给过滤器，Shopify将准许您指定要渲染的格局。

Shopify引见了WebP

就在上周，Shopify开局智能提供WebP图像。WebP是一种现代图像格局，可为Web上的图像提供出色的紧缩，与PNG和JPEG等传统文件格局相比，文件大小平均节俭30％以上。较小的图像象征着更快的下载期间和更少的网络带宽经常使用，这两者都有助于页面显着更快地显示。

要审核您的商店能否正在出现WebP，只有在Chrome中关上开发者控制台，而后转到网络 标签。从新加载您的页面，您应该能够看到类型设置为。

这种改良的优势在于，作为开发人员，您无需启动任何代码更改。此外，对WebP的支持曾经相当不错了，Shopify将在不支持该格局的阅读器中回退到典型的JPEG，例如Safari或IE。

那我何时应该经常使用渐进式JPEG与WebP？

假设您正在经常使用现有主题，除了经常使用提前加载之外，应用WebP降级是坚持速度快的现实模式。

假设你想经常使用渐进式JPEG，请确保你了解为什么要经常使用它们–由于它们也有缺陷。我会正告不要经常使用渐进式JPEG格局来处置像缩略图这样的小图像，由于这些文件的文件大小往往比个别的JPEG图像大。

像任何物品一样，关键的是并看看你所做的扭转能否真的缩小了第一次性无心义的油漆的期间。在某些状况下，经常使用渐进式JPEG或者实践上更好地利用本机WebP格局和提前加载。例如，思考渲染的渐进式JPEG和WebP之间的文件大小差异。假设渐进式JPEG凑近（在10kb到20kb之间）或小于WebP，并且图像在页面加载时可见，则思考经常使用渐进式JPEG而不是WebP。

树立更好的体现

这些新的图像格局使您可以更轻松地确保客户商店的出色功能，从而提高转化率和开售额。经过了解渐进式JPEG和WebP格局之间的差异，您可以协助您的客户树立自己的业务。