Java GWT GIN将多个ClientBundle与ImageResource绑定在一张图片中，以快速加载应用程序

我正在应用程序中使用GWT。对于缓存图片，我使用ClientBundle和ImageResource。我有很多这样的客户包：

public interface MenuBundle extends ClientBundle { 

  @Source(background.png) 
  ImageResource background();

  @Source(image_bg.png) 
  ImageResource image_bg();

...

}

    public interface House1 extends House, ClientBundle { 

      @Source(house1/pic1.png) 
      ImageResource pic1();

      @Source(house1/pic2.png) 
      ImageResource pic2();

      @Source(house1/pic3.png) 
      ImageResource pic3();

    ...

    }

    public interface House2 extends House, ClientBundle{ 

      @Source(house2/pic1.png) 
      ImageResource pic1();

      @Source(house2/pic2.png) 
      ImageResource pic2();

      @Source(house2/pic3.png) 
      ImageResource pic3();

    ...

    }

   public interface House { 

      ImageResource pic1();

      ImageResource pic2();    

      ImageResource pic3();

    ...

    }

还有数百个ClientBundle，使用相同的方法，如下所示：

public interface MenuBundle extends ClientBundle { 

  @Source(background.png) 
  ImageResource background();

  @Source(image_bg.png) 
  ImageResource image_bg();

...

}

    public interface House1 extends House, ClientBundle { 

      @Source(house1/pic1.png) 
      ImageResource pic1();

      @Source(house1/pic2.png) 
      ImageResource pic2();

      @Source(house1/pic3.png) 
      ImageResource pic3();

    ...

    }

    public interface House2 extends House, ClientBundle{ 

      @Source(house2/pic1.png) 
      ImageResource pic1();

      @Source(house2/pic2.png) 
      ImageResource pic2();

      @Source(house2/pic3.png) 
      ImageResource pic3();

    ...

    }

   public interface House { 

      ImageResource pic1();

      ImageResource pic2();    

      ImageResource pic3();

    ...

    }

结果，我在服务器上有数百张图片，比如“*.cache.png”。 为了快速加载，我需要更少的图片。为此，我决定：

public class ClientBundleModule extends AbstractGinModule {

 @Override
 protected void configure() {
  bind(MenuBundle.class).to(ClientBundlePack1.class);
  bind(NatureFuture.class).to(ClientBundlePack1.class);
  ...
  bind(House1.class).to(ClientBundlePack2.class);
  bind(House2.class).to(ClientBundlePack2.class);
  bind(House3.class).to(ClientBundlePack2.class);
  ...
 }
}

public interface ClientBundlePack1 extends MenuBundle, NatureFuture, ... {
}

public interface ClientBundlePack2 extends House1, House2, House3, ... {
}

还有Ginjector。。。但问题是：

ClientBundlePack1中的MenuBundle、NatureFuture和其他类可以在一个大图中编译（这很好），但是House1、House2、House3和其他类不能在一个大图中编译（这很糟糕）

Houses将每个班级的房屋编成一张图片。我认为java扩展实现的方式存在问题，只使用像pic1一样的方法，而不是使用所有方法pic1

但我需要把所有的房子放在一张照片里。GIN有一个设置，一个注释来实现这一点。或者是否有其他方式加入所有的房子？但我不能重写房屋代码，它会破坏我的应用程序的体系结构。我需要所有的房子后，立即预加载，没有“懒加载”

---

谢谢。

您知道只有IE6-7（以及使用HTTPS时的IE8）才会使用这些图像，对吗？所有其他浏览器都将在生成的JS代码中以

data:

URL的形式内联图像。那么，现在IE6-7真的值得这么麻烦吗？我认为@ThomasBroyer的评论有一个警告：如果图像大于某个阈值，那么它们会留在外部文件中，否则它们会使编译后的JS过多。在这种情况下，将捆绑包连接在一起将使gwt能够将图像精灵化为更大的文件。有一个我从未尝试过的想法可能是值得的：制作一个BundleBundle，它有

House1 House1（）

，

House2 House2（）

方法-显然它是受支持的，并且可能让您将所有内容压缩到一个文件中。我最后一个评论的结尾是错误的-虽然您可以创建嵌套的bundle，但它不会创建一个巨大的bundle。也许可以，但是我们需要努力解决合并不应该相互引用的捆绑包的问题。@ColinAlworth如果一个图像太大而不能内联，那么它是否也太大而不能“捆绑”呢？（IIRC，一个阈值与重量有关，另一个阈值与尺寸有关，但交叉点很可能很大）我会说不，它仍然可以是sprite的-10个100x100图像会很大，但最好是做一个大请求，而不是10个小请求。可能还有另一个阈值，在1MB以北的某个地方，不应该添加新图像。