Question

我们正在尝试为我们的网站增加网页分数（谷歌）。其中一个选项是＆＃34; 图片优化＆＃34;。

由于我们在DAM中拥有大量图像，我们如何压缩/优化它们？ AEM是否有任何此类工具可以实现此目的？

ImageMagick 是实现此目标的工具之一。我们是否需要将其与AEM集成，或者在使用该工具压缩它们之后我们必须重新上传所有图像？

有什么建议吗？

Answer 1

与可以gzipped using dispatcher的CSS，JS和HTML文件相比，只能通过降低质量或调整图像大小来压缩图像。

对于AEM项目来说这是一个很常见的情况，有几个选项可以做到这一点，其中一些是开箱即用的，甚至不需要编程：

您可以使用CreateWebEnabledImageProcess工作流程处理步骤扩展DAM Update Asset。它允许您使用大小，质量，mime类型等参数生成新的图像再现。根据工作流启动程序配置，可以在创建或修改资产期间生成此再现。您还可以触发在所选资产或所有资产上运行的工作流程。
如果CreateWebEnabledImageProcess配置不足以满足您的要求，您可以使用例如ImageHelper或某些Java框架来实现您自己的工作流程步骤并以编程方式生成正确的再现转型。如果你想动态生成压缩图像，也可能需要这样做，例如，不是为每个上传的图像生成再现，你可以实现附加到正确的选择器和图像扩展的servlet（即{ {1}}）返回压缩图像。
最终，可以与ImageMagick集成，Adobe documentation描述了如何使用imageName.mobile.png工作流程流程来实现。但是，您需要了解文档中提到的与此相关的安全漏洞。

值得一提的是，如果您的客户将来需要更高级的图像转换解决方案，那么integration with Dynamic Media也可能被视为可能，但这是最昂贵的解决方案。

Answer 2

有很多方法可以优化AEM中的图像。在这里，我将介绍其中的三种方法。

1）使用DAM更新资产工作流程。

这是AEM中的开箱即用工作流程，在上传图像时可以创建表格。您可以在img src属性中使用这些再现路径。

2）使用ACS commons图像变换器

安装ACS commons Package，使用Image变换器Servlet配置根据需要生成优化或转换的图像。有关此检查的更多信息ACS AEM commons。

3）在调度员级别使用Google PageSpeed

如果您想缩小图片尺寸，可以考虑使用Google PageSpeed。在调度程序级别安装PageSpeed并添加图像优化规则以满足您的要求。此规则Insights会检测页面上可以优化的图像，以减少文件大小而不会显着影响其视觉质量。有关详情，请点击此处Optimising Images

Answer 3

AEM提供“图像优化”选项，但这是一个广泛的主题，因此没有“魔术”开关可以转向“优化”您的图像。这一切都归结为从AEM传输到用户浏览器的千兆或兆字节数。

资产的大小受两件事的影响：

资产维度（宽度和高度）。
压缩。

通过简单地减少资产规模可以实现最大的收益。 AEM已经做到了。如果您查看资产再现，您会注意到不仅有所谓的原始再现，还有其他几个不同维度的再现。

MyImage.jpg
└── jcr:content
    └── renditions/
        ├── cq5dam.thumbnail.140.100.png
        ├── cq5dam.thumbnail.319.319.png
        ├── cq5dam.thumbnail.48.48.png
        └── original

再现名称中的数字是再现的宽度和高度。因此，MyImage.jpg的版本宽度为140像素，高度为100像素，依此类推。

这一切都是在上传图片时由DAM Update Asset工作流程完成的，并且可以修改以生成具有不同尺寸的更多版本。

但生成不同尺寸的图像只是故事的一半。 AEM必须在适当的时刻选择具有正确尺寸的再现。这通常被称为“响应图像”。 AEM图像组件不支持开箱即用的“响应”图像，有几种方法可以实现此功能。

它的要点是您的图像组件必须包含不同大小的再现的URL列表。当页面呈现时，客户端JavaScript会确定哪个呈现最适合当前屏幕大小，并将该URL添加到img标记src属性。

我建议您查看AEM中未包含的相当新的AEM Core组件。这些核心组件包含支持响应图像的图像组件。你可以在这里阅读更多相关内容：

AEM Core Components Image Component (GitHub)
AEM Core Components Documentation

通常，像这样的组件不会使用已经由 DAM更新资产工作流生成的“静态”格式，而是依赖于自适应图像Servlet。此servlet基本上获取资产路径和目标宽度，并将以请求的宽度返回资产。为了避免反复这样做，您应该允许Dispatcher缓存生成的图像。

这些只是你能做的基本事情。还有很多其他事情可以做，但所有这些事情在“优化”方面的收益越来越少。

Answer 4

我有同样的需求，我也看了ImageMagick并研究了各种选项。最终，我定制了用于创建图像再现以与其他工具集成的工作流程。我修改它们以使用Kraken.io API自动将生成的再现图像AEM发送到Kraken，在那里它们将完全通过Web优化（使用默认的Kraken设置）。我使用他们的Java integration library来获取此集成的基本代码。因此，最终我得到了适当的网络优化图像，用于所有生成的再现（并且可以对原始文件执行相同），这些图像在工作流程中自动优化，而无需作者手动重新上传图像。此API使用需要Kraken许可证。

所以我相信答案是，此时AEM没有提供实现此功能的功能，您最好的选择是与其他工具集成（自定义代码）。

TinyPng.com是另一种图像优化服务，它似乎对这种需求有好处，而且还有一个API。

为了记录，我还将此作为功能请求提交给我们的AEM代表。这对我来说似乎是一个明显的产品差距，我感到惊讶的是还没有将产品内置到产品中，以便让客户能够对图像进行完全网络优化。

我们如何在DAM AEM6.3中压缩图像？

4 个答案: