有效地从 GWT 中的服务器加载许多图像？答案

【问题标题】：Loading many Images from a Server in GWT efficiently?有效地从 GWT 中的服务器加载许多图像？
【发布时间】：2013-11-29 23:53:19
【问题描述】：

我使用 JSON 从服务器请求许多图像以显示在一个

<g:Image />

在 GWT 客户端。

我现在正在做的是发送一个 GET 请求，该请求返回一个图像 url 的 JSON 列表，该列表指向我服务器上的图像。

当我将这些 url 附加到我的 gwt 图像时，我想它会在不同的请求中加载每个图像。

有没有办法结合来自图片url的图片请求来减少请求？
我的方法可行吗？

编辑：

好吧，我知道对于静态图像，我使用 ClientBundle。但是假设您的应用程序可以创建图像并将它们存储在服务器文件系统上。然后，当您从您的应用程序请求这些图像时，您需要另一种方法。你有什么建议？

【问题讨论】：

您是否尝试保存浏览器 HTTP 请求以进行图像检索？
使用 HTTP 1.1 你不能重复使用相同的连接，所以唯一的方法是使用 sprite 技术组合图像。 GWT 是为静态图片做的，也许你可以动态地将你想要加载的图片放在一起，但我认为“不值得”。
@Fedy2 那么分别加载每个图像的方式是要走的路吗？
对我来说是的，这是要走的路。

标签： javascript json gwt uibinder

【解决方案1】：

在 GWT 中处理图像的最佳方式是使用 ImageResources。

你必须创建一个 ImageResource：

public interface ImageResources extends ClientBundle {

  ImageResources IMAGE_RESOURCES = (ImageResources) GWT.create(ImageResources.class);

  @Source("Gwt-logo.png")
  ImageResource gwtLogo();

}

并将您的图像放在同一个客户端包中。

在您的 ui.xml 中，您可以像这样引用图像资源：

<ui:with field="imageResources" type="com.path.client.resources.ImageResources" />

并像这样使用图像资源：

<g:Image resource="{imageResources.gwtLogo}"/>

GWT 会为您的所有图像创建一个精灵，并通过一次调用加载该精灵。这很有效。

【讨论】：

好吧，我知道对于静态图像，我使用 ClientBundle。但是假设您的应用程序可以创建图像并将它们存储在服务器文件系统上。然后，当您从您的应用程序请求这些图像时，您需要另一种方法。你有什么建议？