Search code examples
iosobjective-cuitableviewsdwebimage

iOS tableview lags on scrolling when loading image to imageview


I'm using a library for asynchronous (background) image loading for UITableviewCell called SDWebImage. But still facing huge lag when scrolling tableview.

Am I doing something wrong?

Loaded image sizes are quite big around 1000x1000

Code which loads image to cell:

[cell.image sd_setImageWithURL:[NSURL URLWithString:imageUrl]
            placeholderImage:[UIImage imageNamed:@"image.png"]];

Here I'm loading all info to tableview cell:

-(void)viewDidLoad{
    [super viewDidLoad];
NSString *identifier = @"newsItem";
UINib *nib = [UINib nibWithNibName:@"NewsTableViewCell" bundle:nil];
[self.tableView registerNib:nib forCellReuseIdentifier:identifier];


self.dataSource = [[NewsDataSource alloc] initWithQuery:[self getQuery]
                                           populateCell:^UITableViewCell * _Nonnull(UITableView * _Nonnull tableView,
                                                                                    NSIndexPath * _Nonnull indexPath,
                                                                                    FIRDataSnapshot * _Nonnull snap) {

                                               NewsItem *newsItem = [[NewsItem alloc] initWithDictionary:snap.value];


                                               NSURL *url = [NSURL URLWithString:newsItem.image];

                                               NSString *imageUrl = url.absoluteString;
                                             NSData *data = [NSData dataWithContentsOfURL:url];


                                               NewsTableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:identifier];
                                             cell.image.layer.masksToBounds = YES;
                                               cell.Title.text = newsItem.title;
                                               cell.category.text = [newsItem.categories objectAtIndex:0];
                                               cell.subTitle.text = newsItem.subTitle;

                                               [cell.image sd_setImageWithURL:[NSURL URLWithString:imageUrl]
                                                            placeholderImage:[UIImage imageNamed:@"image.png"]];                          
                                               cell.image.contentMode = UIViewContentModeScaleAspectFill;
                                               [cell.image setFrame:CGRectMake(0,0,cell.frame.size.width,cell.frame.size.height)];

                                               cell.selectionStyle = UITableViewCellSelectionStyleNone;

                                               return cell;
                                           }];

[self.dataSource bindToView:self.tableView];
self.tableView.delegate = self;
}

Solution

  • Remove following line from your source code, as it downloads image data during activation (every time when your cell is being reused) of your tableview cell. Also note, it may loads data foreground and that may be the reason for lag when scrolling tableview.

    NSData *data = [NSData dataWithContentsOfURL:url];
    

    Following code handles image representation (downloading of image in background and make it visible in foreground) for your tableview cell. So above code is not required in your cell.

    [cell.image sd_setImageWithURL:[NSURL URLWithString:imageUrl] placeholderImage:[UIImage imageNamed:@"image.png"]];