UIImage Performance solution

Question

Is there a more elegant solution for this question?

I have about 70 .png images I want to load and randomly pull from an array when a button is pressed. (Up to 50 images could be on screen at once and each is 40-68kbs in size with dimensions of 150X215, obviously there will be over lap and covered images behind foreground images at times) Should I use the following example to pull that off?

EXAMPLE:

-(void)viewDidLoad {
    UIImage *dogImage = [UIImage imageNamed: @"dog.png"];
    UIImage *catImage = [UIImage imageNamed: @"cat.png"];
    // And so on 68 more times followed by....

    for (int i = 1; i <= 70; i++) {
        UIImageView *dogView = [[UIImageView alloc]initWithImage:dogImage];
        UIImageView *catView = [[UIImageView alloc]initWithImage:catImage];

        // And so on 68 more times followed by.... 

        NSArray *animalArray = [[NSArray alloc] initWithObjects: dogView, catView, nil];

        // And so on 68 more times ending the array with ,nil

        // other code and and release calls, etc... 

    }

}

Is this fine for performance or am I going to crash the app at launch or soon after? The

Anyone alternatives to doing it this way?

Answer 1

Hmmm, that's around 3.8MB of images. That might take some time to load while the user is sitting there waiting for the view to appear. Try it and see how long it takes.

If the image is not needed until the button is pressed, load it then! You're wasting a lot of time loading 70 images if you only use one of them at a time.

I would suggest that you don't try to load all these in ViewDidLoad. If you must have them all in the array at once then load the images into an array on a separate thread and as each one gets loaded add it to the array.

Answer 2

Also, you need to remember that the size of the image you're quoting is its compressed size. As soon as that image is used in a view, it'll be uncompressed to be drawn to the graphics context. The uncompressed size of 70 images is going to be a hell of a lot more than a few megabytes.

If you load them all that the same time you'll likely crash the app with an out of memory error.

I suggest only storing the image filenames in the array and only loading the image when it's actually required.

Also, there are some differences in the way that UIImage loads image data depending on what method you use to load the image. I'm not confident enough in my memory of this situation to write down the exact differences. The basic idea is that imageNamed: will load and cache the image for you, while (I think) initWithContentsOfFile will load the image data on demand, saving you some memory until the very last minute when the image is needed.

Answer 3

Drawing that many images at once, it's time to look at DrawRect.

I'd say you could use UIImage's imageNamed method to load images when you press the button. That does some caching so repeated images will load faster saving you memory.

Then for drawing them to screen, you want to use one view and use the Quartz2D drawing methods to put them on the screen. Having them all as separate UIImageViews would chew up more memory and really slow things down if you are doing any scrolling or animation.

Answer 4

As well as loading the images on demand, you might also consider storing them using PowerVR texture compression. You don't need to be doing OpenGL to use this compression mode - all the graphics APIs on the iPhone are set up to handle it. The files will be larger on disc than with PNG compression, but the beauty of it is that they don't need to be de-compressed in memory - the compressed image data is rendered directly.