I have a class Image and another one ImageStore. The Image it’s just a value object containing the package name and the image name. The ImageStore does all the actual work: calculates the real path of the image (based on the package and image name) and loads it from the server.

Now I have a quite big (and deep) hierarchy of nodes (this is a render engine for a game) so for example now I am in a group and I want to insert a new Image. I do:

var image = new Image("packageName", "imageName");

At this moment the Image doesn’t have any size yet, as I don’t want to hard code the image size (in this case this can be a tile, which is not always 64*32 for example) in my game view.

• when the Image is added to the Group (I suppose the group is already attached to the Renderer) then the Group will be invalidated
• the Renderer will request a new frame render.
• it will parse the hierarchy tree of node and when it finds the Image I’ve added before
• it will ask the ImageStore (or TileImageStore, this one not only stores the width and height but also the bottom center point of the tile. This only when the bottom center of the tile doesn’t match the bottom center point of the real image.) for the ImageData;
• the ImageStore now loads the package, which also has the info about the width and height;
• it will apply the new width and height to the image and will set a flag as loaded.

I would like to have somehow the ImageStore detached from the render. To be able to use only the Image and ImageStore without the need of the renderer.

Edit:
I want to do this because I would like to know the size of a image even when the image is not rendered. In order to get the image it has to ask the ImageStore for the size, anchor and imageData. The packages are like this:

package = {image01: {base64: "very very long string", width: 10, height: 20, anchorX: 1, anchorY: 10}}

Only after the ImageStore loads this big file is able to know the image width/height;