Optimization ClientBundle图像资源的GWT代码拆分模式

在我的GWT大型项目中，我有一个用于图像资源的ClientBundle。我在里面定义了大约40个GIF文件。（每个文件的大小约为5KB）

然后，我使用静态方法创建一个类，以将适当的图像设置为obj，并将其作为参数：

 public static void setImageFromId (String id,final Image img) {

    //for 1.gif
    if (id.equals("1")) {
        GWT.runAsync(new RunAsyncCallback() {
            @Override
            public void onFailure(Throwable reason) {}
            @Override
            public void onSuccess() {
                img.setResource(MyImages.INSTANCE.img1()); //MyImages is the ClientBundle
            }
        });
    }             

 }

    //for 2.gif
    if (id.equals("2")) {
        GWT.runAsync(new RunAsyncCallback() {
            @Override
            public void onFailure(Throwable reason) {}
            @Override
            public void onSuccess() {
                img.setResource(MyImages.INSTANCE.img2()); //MyImages is the ClientBundle
            }
        });
    }             

   //etc. for other images 3, 4, 5, ...
   //...

 }

我想知道这是一种很好的代码拆分模式吗？因为如果我不这样做的话，所有的40个文件都会在第一次调用时缓存到客户端浏览器中，但这不是必需的

---

RGDS

因此，在加载页面时，您试图避免下载每个图像。如果你事先不知道是否需要每张图片，那就好了

但是，您的代码所做的是使用代码拆分，仅在需要图像时下载代码以显示图像，正如您所看到的，每个图像只有一行代码

请尝试以下代码：

if (id.equals("1")) {
  img.setSrc(MyImages.INSTANCE.img1().getUrl());
} else if (id.equals("2")) {
  //.. and so on.
}

只有在需要相关图像时，才会下载和显示图像。您可以使用或查看图像的下载时间，只有在需要时才会请求图像

---

如果您还有任何问题，或者发现您的所有图像都在下载页面，请告诉我，我会再次编辑我的答案以帮助您。

我无法理解您！你能举个例子吗？如果我不这么做，在第一次调用“setImageFromId（..”）时，所有资源都下载为x.cache.js（40*5KB=200KB），而我只需要其中一个（5KB），我已经编辑了我的答案，希望能更清楚。如果不是，或者您发现它不适合您，请告诉我。您的意思是在这些情况下，我应该通过setUrl而不是setResource获取图像？不幸的是，我测试了所有下载的图像，因为MyImages.INSTANCE.imgX（）.getUrl（）在您的示例中使用setUrl或setResource没有区别！因为您使用的是MyImages.INSTANCE.img1，所以所有图像下载并缓存一次，所以我认为最好的方法是将所有图像放在公用文件夹中，并通过setUrl（“./images/img1.gif”）进行设置，您认为如何？