在PHP中以编程方式组合图像 [英] Programmatically combining images in PHP
问题描述
我是Yahoo提速网站的建议的忠实拥护者.建议之一是在可能的情况下合并图像以减少大小和请求数量.但是，我注意到，虽然可以很容易地将CSS Sprite用作布局，但将其他图像使用起来却不那么容易.我想到的主要示例是博客或文章列表，其中每个博客或文章也都有与之关联的图像.这些图像可能会极大地影响加载时间和页面大小，特别是如果未对其进行优化的话.我在概念上或实践中寻找的是一种动态组合这些图像的方法，同时使用PHP通过无损压缩来运行它们.
I'm a big fan of Yahoo's recommendations for speeding up websites. One of the recommendations is to combine images where possible to cut down on size and the number of requests. However, I've noticed that while it can be easy to use CSS sprites for layouts, other image uses aren't as easily combined. The primary example I'm thinking of is a blog or article list, where each blog or article also has an image associated with it. Those images can greatly affect load time and page size, especially if they aren't optimized. What I'm looking for, in concept or in practice, is a way to dynamically combine those images while running them through a loss-less compression using PHP.
一些附加的想法或疑虑:
A few added thoughts or concerns:
- 组合图像并生成 动态CSS样式表来定位 图片的背景可能 成为解决问题的一种方法，但是我 也担心可及性 语义.据我所理解， CSS图片应用于布局 元素和img标签(带有 alt属性)应用于 旨在传达的图像 信息.我可以设置图像 作为div元素的背景，以及 用title属性代替 alt属性，但我不确定 可访问性和语义 这样做的意义.
- 可能GD库是一个很好的库 像这样的候选人? 您可以推荐其他选项吗?
- Combining the images and generating a dynamic CSS stylesheet to position the backgrounds of the images might be one way to go about it, but I also worry about accessibility and semantics. As far as I understand, CSS images should be used for layout elements and the img tag (with the alt attribute) should be used for images that are meant to convey information. I could set the image as a background to a div element and substitute a title attribute for the alt attribute, but I'm unsure about the accessibility and semantic implications of doing so.
- Might the GD library be a good candidate for something like this? Can you recommend other options?
推荐答案
如果我是你，我不会走这条路.当然，可以通过减少请求数量来节省协议开销的几个字节，但这很可能最终会导致自欺欺人.
I wouldn't go down this route if I were you. Sure, you may save a few bytes in protocol overhead by reducing the number of requests, but this would more-tha-likely end up being self-defeating.
想象一下这种情况: 一个博客站点，其首页一次包含10篇文章.每篇文章都有与之关联的自己的图像.为了节省一个或两个字节的传输时间，您可以以编程方式创建所有10个商品图像的复合图像.您现在遇到两个问题之一.
Imagine this scenario: A blog site, whose front page has 10 articles at a time. Each article has it's own image associated with it. To save a byte or two of transfer time, you programatically create a composite image of all 10 article images. You now have one of two problems.
- 每次发表新帖子时，您都必须更新合成图像，因为最近的10张图像将具有一组修改后的内容.
- 您决定动态地为每个请求创建一个新的组合.
很显然，这里#1是更可取的，并且实现起来并不困难.但是，如果用户搜索所有标有"SQL"字样的帖子怎么办?您不可能已经为该简单查询创建了前10个结果的合成图像，更不用说更复杂的了.另外，如果您要更新或删除图像，该怎么办?再一次，您必须触发合成的后台创建.
Obviously, #1 is preferable here, and would not be difficult to implement. However, what if a user searches for all posts tagged with the word "SQL"? You are unlikely to have a composite image of the first 10 results already created for this simple query, let alone a more complex one. Also, what happens if you want to update or delete an image? Once again you'd have to trigger the background creation of the composite.
RSS聚合器(如Google Reader)怎么样?它没有所需的逻辑来确定合成图像的哪一部分需要显示，并且可能会显示完整图像. (我之所以提到Google Reader，是因为我很少直接访问博客网站，而倾向于信任Reader之类的RSS聚合服务)
How about an RSS aggregator, like Google Reader? It wouldn't have the required logic to figure out which portion of a composite image it would need to display, and would probably display the full image. (I mention Google Reader because I very rarely visit blog sites directly, tending to trust to an RSS aggregation service like Reader)
如果是我，我将不理会单个图像.在现代的连接速度下，额外的带宽开销和服务器上的处理时间之间的权衡不太可能赢得您并获得丰厚的收益.
If it were me, I'd leave the single images alone. With modern connection speeds, the tradeoff between additional bandwidth overhead and on-server processing time is unlikely to win you and great gains.
话虽如此，如果您仍然决定沿这条路线走，我想说GD库是一个很好的起点.
Having said that, if you decide to go down this route anyway, I'd say the GD library is an excellent place to start.
这篇关于在PHP中以编程方式组合图像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
