Html 为动态图像生成CSS精灵

我有一个网页，其中包含约20-50个动态图像（图像从非静态源服务）。这些图像通过基于请求URL的servlet提供。这会导致每个映像生成一个请求，从而导致性能下降

如果这些图像是静态的，我会创建一个CSS精灵，并用一个替换50个请求。由于它们是动态的，这当然不是那么容易。我正在寻找一个工具/库/方法，我可以使用它在运行时将这些图像聚合到单个sprite中。幸运的是，图像大小是恒定的，并且对所有人来说都是一样的，这应该使这更容易

---

有什么建议吗？

您可以检查并尝试jawr（）库，以便在servlet上生成/修改（以及压缩、合并）css文件。它具有动态更改背景图像的选项。 您可以安排用于切换css文件的捆绑包，以更改皮肤

---

另一方面：你也可以管理和整理你的.js文件

通过调用系统命令行，您可以使用免费库附加图像，这样您就不用用Java编写代码，而且速度更快

要水平追加，请使用以下命令：

convert image1.gif image2.gif image3.gif +append result.gif

convert image1.gif image2.gif image3.gif -append result.gif

要垂直追加，请使用以下命令：

convert image1.gif image2.gif image3.gif +append result.gif

convert image1.gif image2.gif image3.gif -append result.gif

有关更多信息：

---

因此，使用CSS，您可以使用带有简单偏移的单个图像显示精灵（您可以使用CSS“背景”属性加载图像并设置要显示的单个精灵的偏移）。如果只做简单的事情，就不需要JavaScript。

服务器上的处理开销值得吗

我现在正在为C#考虑这一点，交易增加了创建动态图像并将其发送到客户端的复杂性，同时减少了对单个图像的访问

---

这是一个值得分析的权衡。

Java-对不起，应该强调servlet。您好@Zecrates我也面临同样的问题，请您详细说明您是如何解决这个问题的。谢谢。快速看了一下，它似乎可以做我想做的，谢谢！