setImage：forState：滞后于UI

Question

I have a tableview which runs some code for fetching a UIImage from NSData in a background thread, then in the foreground it calls [button setImage:image forState:UIControlStateNormal]; .

The problem is that it freezes the UI for a split second on that line, until it's complete. This means that the UI freezes while it sets it as the image. Because the user is scrolling, this is very noticeable and jittery. Is there any way to avoid my UI from freezing like this?

dispatch_queue_t cellSetupQueue = dispatch_queue_create("Setup", NULL);
dispatch_async(cellSetupQueue, ^{
    UIImage *image = [self.mediaDelegate largeThumbnailForMediaAtIndex:indexPath.row];
    dispatch_async(dispatch_get_main_queue(), ^{     
        [self.thumbnailButton setImage:image forState:UIControlStateNormal];
    });
});

dispatch_release(cellSetupQueue);

Answer 1

I'm guessing your images are JPGs. If so then UIImage will defer decoding the actual image until the first time it actually needs those pixels. Check out the ImageIO framework for more precise control on this. Here's a snippet I use:

CGImageSourceRef source = CGImageSourceCreateWithData((__bridge CFDataRef)data, NULL); // data is your image file NSData
if (source)
{
    NSDictionary *dict = @{ (__bridge NSString *)kCGImageSourceShouldCache : @(YES) };
    CGImageRef cgImage = CGImageSourceCreateImageAtIndex(source, 0, (__bridge CFDictionaryRef)dict);
    if (cgImage)
    {
        CFRelease(source);
        return cgImage; // you can keep this reference so you dont have to decode again later
    }
}

The important part is the kCGImageSourceShouldCache option. You can run this code on the background thread and pass the decoded image to the UI thread.