在 PHP 中以编程方式组合图像

Posted 2023-03-06

【中文标题】在 PHP 中以编程方式组合图像

【英文标题】：Programmatically combining images in PHP

【发布时间】：2010-09-27 08:53:32

【问题描述】：

我非常喜欢 Yahoo 的 recommendations，因为它可以加快网站速度。建议之一是尽可能组合图像以减少大小和请求数量。然而，我注意到虽然使用 CSS sprites 进行布局很容易，但其他图像用途却没有那么容易组合。我想到的主要示例是博客或文章列表，其中每个博客或文章也有与之关联的图像。这些图像会极大地影响加载时间和页面大小，尤其是在未优化的情况下。无论在概念上还是在实践中，我正在寻找的是一种动态组合这些图像的方法，同时使用 php 通过无损压缩运行它们。

添加一些想法或顾虑：

合并图像并生成 要定位的动态 CSS 样式表 图像的背景可能 成为解决问题的一种方法，但我 还担心可访问性和 语义。据我所理解， CSS图像应该用于布局 元素和 img 标签（带有 alt 属性）应该用于 旨在传达的图像 信息。我可以设置图像 作为 div 元素的背景和 用标题属性替换 alt 属性，但我不确定 可访问性和语义 这样做的影响。 GD 库可能是个好东西 像这样的候选人？ 您能推荐其他选择吗？

【参考方案1】：

几乎可以肯定的是，减少文章中图片的文件大小比合并它们更好。我同意您建议的方法可能存在可访问性问题。另外，我想这取决于您所说的“动态”的含义-如果您正在考虑组合这些图像并为每个页面加载生成 CSS，您可能会发现这会导致平均连接速度的用户的页面加载时间变慢.

关于你的第二点，GD当然可以处理。更好地使用 GD 来减少页面加载时间可能是在文章创建时而不是在页面加载时降低文章图像的图像质量以减小文件大小。

【讨论】：

好点。我也是这么想的，但还是决定看看其他人的想法。

【参考方案2】：

如果我是你，我不会走这条路。当然，您可以通过减少请求的数量来节省一些协议开销，但这很可能会弄巧成拙。

想象一下这个场景： 一个博客网站，其首页一次有 10 篇文章。每篇文章都有与之相关的自己的图像。为了节省一两个字节的传输时间，您以编程方式创建了所有 10 个文章图像的合成图像。您现在遇到了两个问题之一。

您必须在每次发布新帖子时更新合成图片，因为最近的 10 张图片将包含一组经过修改的内容。 您决定即时为每个请求创建一个新的组合。

显然，#1 在这里更可取，并且实施起来并不困难。但是，如果用户搜索所有带有“SQL”标签的帖子怎么办？您不太可能已经为这个简单的查询创建了前 10 个结果的合成图像，更不用说更复杂的了。另外，如果您想更新或删除图像会怎样？再次，您必须触发合成的背景创建。

像 Google Reader 这样的 RSS 聚合器怎么样？它没有必要的逻辑来确定需要显示合成图像的哪个部分，并且可能会显示完整图像。 （我之所以提到 Google Reader，是因为我很少直接访问博客网站，倾向于信任 Reader 之类的 RSS 聚合服务）

如果是我，我会单独留下单个图像。在现代连接速度的情况下，额外带宽开销和服务器上处理时间之间的权衡不太可能赢得您和巨大的收益。

话虽如此，如果你决定走这条路，我想说 GD 库是一个很好的起点。

【讨论】：

优秀的答案 - 我没有想到你的第一点（不同页面加载的图像组合可能不同）。

非常好的点。我没有考虑搜索结果页面等。这个问题有点大声思考，但我正在争论在考虑图像创建过程时是否值得任何性能提升。我可能会接受压缩。