I am getting data via RSS feeds and displaying each article in a table view cell. Each cell has an image view, set to a default image. If the page has an image, the image is to be replaced with the image from the article. As of now, each cell downloads the source code from the web page, causing the app to lag when I push the view controller and when I try scrolling.
Here is what I have in the cellForRowAtIndexPath: method.
NSString * storyLink = [[stories objectAtIndex: storyIndex] objectForKey: @"link"];
storyLink = [storyLink stringByTrimmingCharactersInSet:[NSCharacterSet whitespaceAndNewlineCharacterSet]];
NSString *sourceCode = [NSString stringWithContentsOfURL:[NSURL URLWithString:storyLink] encoding:NSUTF8StringEncoding error:&error];
NSString *startPt = @"instant-gallery";
NSString *startPt2 = @"<img src=\"";
if ([sourceCode rangeOfString:startPt].length != 0) { //webpage has images
// find the first "<img src=...>" tag starting from "instant-gallery"
NSString *trimmedSource = [sourceCode substringFromIndex:NSMaxRange([sourceCode rangeOfString:startPt])];
trimmedSource = [trimmedSource substringFromIndex:NSMaxRange([trimmedSource rangeOfString:startPt2])];
trimmedSource = [trimmedSource substringToIndex:[trimmedSource rangeOfString:@"\""].location];
NSURL *url = [NSURL URLWithString:trimmedSource];
NSData *data = [NSData dataWithContentsOfURL:url];
UIImage *image = [UIImage imageWithData:data];
cell.picture.image = image;
Someone suggested using NSOperationQueue. Would this way be a good solution?
EDIT:
dispatch_queue_t someQueue = dispatch_queue_create("cell background queue", NULL);
dispatch_async(someQueue, ^(void){
NSError *error = nil;
NSString * storyLink = [[stories objectAtIndex: storyIndex] objectForKey: @"link"];
storyLink = [storyLink stringByTrimmingCharactersInSet:[NSCharacterSet whitespaceAndNewlineCharacterSet]];
NSString *sourceCode = [NSString stringWithContentsOfURL:[NSURL URLWithString:storyLink] encoding:NSUTF8StringEncoding error:&error];
NSString *startPt = @"instant-gallery";
NSString *startPt2 = @"<img src=\"";
if ([sourceCode rangeOfString:startPt].length != 0) { //webpage has images
// find the first "<img src=...>" tag starting from "instant-gallery"
NSString *trimmedSource = [sourceCode substringFromIndex:NSMaxRange([sourceCode rangeOfString:startPt])];
trimmedSource = [trimmedSource substringFromIndex:NSMaxRange([trimmedSource rangeOfString:startPt2])];
trimmedSource = [trimmedSource substringToIndex:[trimmedSource rangeOfString:@"\""].location];
NSURL *url = [NSURL URLWithString:trimmedSource];
NSData *data = [NSData dataWithContentsOfURL:url];
UIImage *image = [UIImage imageWithData:data];
dispatch_async(dispatch_get_main_queue(), ^(void){
cell.picture.image = image;
});
});
dispatch_release(someQueue);
return cell;
}

For whatever that might be causing the lag, put it in the background thread. When you are ready to update your UI, update it on the main thread. Maybe you can give GCD at try –
EDIT:
When you have some process that might slow down your app, you want to put it in a background queue. To put them in background queue, you use
dispatch_async:where
someQueueis the background queue you created and want work to be done. However, anything related to the UI needs to be on the main queue, or else some funky stuff can happen. That is why within thatdispatch_async, we put anotherdispatch_async. This time, we specify the UI (cell.picture.image) needs to be updated on the main queue:dispatch_get_main_queue().Hope this clears it up a bit.