CODEWITHSUNDEEP
iosobjective-cuitableview
Travis Tubbs
Travis Tubbs

Reputation: 877

laggy scrolling tableview with images

I added images to my tableView cells and it made it laggy. I am still new to objective c and I do not understand what is causing this or how to fix it. Any help is greatly appreciated!

group[PF_GROUP_LOGO] is simply a string in my database that is unique to each object. The code works, it is just really laggy when trying to scroll.

//-------------------------------------------------------------------------------------------------------------------------------------------------
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
//-------------------------------------------------------------------------------------------------------------------------------------------------
{
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"cell"];
    if (cell == nil) cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleSubtitle reuseIdentifier:@"cell"];

    PFObject *group = groups[indexPath.row];


    UIImage *image = [UIImage imageWithData:[NSData dataWithContentsOfURL:[NSURL URLWithString:group[PF_GROUP_LOGO]]]];
    cell.imageView.image = image;

    cell.detailTextLabel.text = [NSString stringWithFormat:@"%d users", (int) [group[PF_GROUP_MEMBERS] count]];
    cell.detailTextLabel.textColor = [UIColor lightGrayColor];


    return cell;
}

Upvotes: 2

Views: 902

Answers (1)

dokun1
dokun1

Reputation: 2110

There are so many tools out there that can help you with this.

At a base level, the issue is that you are running a long process on the main thread, which blocks the UI. Loading an image from a non-local URL is time consuming, and you should do this on a background thread, so the UI is not blocked.

Again, there are so many ways to do this, and I strongly suggest you do some research on async resource loading, but this is one thing you can do within the confines of your own example:

//-------------------------------------------------------------------------------------------------------------------------------------------------
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
//-------------------------------------------------------------------------------------------------------------------------------------------------
{
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"cell"];
    if (cell == nil) cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleSubtitle reuseIdentifier:@"cell"];

    PFObject *group = groups[indexPath.row];
    dispatch_async(dispatch_get_global_queue(DISPATCH_QUEUE_PRIORITY_BACKGROUND, 0), ^{ // go to a background thread to load the image and not interfere with the UI
        UIImage *image = [UIImage imageWithData:[NSData dataWithContentsOfURL:[NSURL URLWithString:group[PF_GROUP_LOGO]]]];
        dispatch_async(dispatch_get_main_queue(), ^{ // synchronize back to the main thread to update the UI with your loaded image
            cell.imageView.image = image;
        });
    });

    cell.detailTextLabel.text = [NSString stringWithFormat:@"%d users", (int) [group[PF_GROUP_MEMBERS] count]];
    cell.detailTextLabel.textColor = [UIColor lightGrayColor];

    return cell;
}

I would also recommend using AFNetworking as the author has built a very good category on top of UIImageView that allows you to load an image from a web URL in the background automatically. Again, there are many schools of thought on this process, and this is just one idea. I would recommend reading this for a full on tutorial on the topic.

I hope this is helpful!

Upvotes: 8

Related Questions