iOS开发使用tableView从服务器加载图片时的卡顿现象解决方案

新手做开发的时候一般都会遇到使用tableView从网上加载图片并显示图文的时候会有卡顿现象，而这种卡顿现象也是因为多种原因造成的。一般可以分为两种：一种是由于网上加载图片需要动态定义cell的高度（如果是固定的高度，可以忽略），而在定义cell高度的时候一般都会先去下载图片然后再计算图片的大小，进而计算cell的高度。另一种就是在cell显示图片时，没有进行异步处理加载图片与显示的逻辑。

下面进行对上面两种造成卡顿的原因提出我的方法，对于第一种可以进行抓去图片的URL的http头部信息，计算cell高度的时候只去获取图片的大小，而不去下载图片。这样就会免去下载图片这个耗时的过程，而只在cell中显示图片的时候才去真正下载图片。这里给出图片类型为JPG的方法中：

#pragma mark -
#pragma mark JPG格式的图片 根据图片部份数据得到图片的size
+ (CGSize)downloadJpgImage:(NSString*)strUrl
{
    NSMutableURLRequest *request = [[NSMutableURLRequest alloc] initWithURL:[NSURL URLWithString:strUrl]];
    [request setValue:@"bytes=0-209" forHTTPHeaderField:@"Range"];
    NSData *data = [NSURLConnection sendSynchronousRequest:request returningResponse:nil error:nil];
    return [self jpgImageSizeWithHeaderData:data];
}

+ (CGSize)jpgImageSizeWithHeaderData:(NSData *)data
{
    if ([data length] <= 0x58) {
        return CGSizeZero;
    }
    if ([data length] < 210) {// 肯定只有一个DQT字段
        short w1 = 0, w2 = 0;
        [data getBytes:&w1 range:NSMakeRange(0x60, 0x1)];
        [data getBytes:&w2 range:NSMakeRange(0x61, 0x1)];
        short w = (w1 << 8) + w2;
        short h1 = 0, h2 = 0;
        [data getBytes:&h1 range:NSMakeRange(0x5e, 0x1)];
        [data getBytes:&h2 range:NSMakeRange(0x5f, 0x1)];
        short h = (h1 << 8) + h2;
        return CGSizeMake(w, h);
    } else {
        short word = 0x0;
        [data getBytes:&word range:NSMakeRange(0x15, 0x1)];
        if (word == 0xdb) {
            [data getBytes:&word range:NSMakeRange(0x5a, 0x1)];
            if (word == 0xdb) {// 两个DQT字段
                short w1 = 0, w2 = 0;
                [data getBytes:&w1 range:NSMakeRange(0xa5, 0x1)];
                [data getBytes:&w2 range:NSMakeRange(0xa6, 0x1)];
                short w = (w1 << 8) + w2;
                short h1 = 0, h2 = 0;
                [data getBytes:&h1 range:NSMakeRange(0xa3, 0x1)];
                [data getBytes:&h2 range:NSMakeRange(0xa4, 0x1)];
                short h = (h1 << 8) + h2;
                return CGSizeMake(w, h);
            } else {// 一个DQT字段
                short w1 = 0, w2 = 0;
                [data getBytes:&w1 range:NSMakeRange(0x60, 0x1)];
                [data getBytes:&w2 range:NSMakeRange(0x61, 0x1)];
                short w = (w1 << 8) + w2;
                short h1 = 0, h2 = 0;
                [data getBytes:&h1 range:NSMakeRange(0x5e, 0x1)];
                [data getBytes:&h2 range:NSMakeRange(0x5f, 0x1)];
                short h = (h1 << 8) + h2;
                return CGSizeMake(w, h);
            }
        } else {
            return CGSizeZero;
        }
    }
}

其他图片的方法可以参照：

对于第二种原因的解决方法就是使用异步加载的方式，当然首先你得知道我们经常用的网络加载图片的库是SDWebImage。另外，如果想进行异步加载图片的话最好自定义cell，数据的加载放在customCell中进行赋值。

异步加载：

dispatch_async(dispatch_get_global_queue(DISPATCH_QUEUE_PRIORITY_DEFAULT, 0), ^{
                    [stImgView setImageWithURL:[NSURL URLWithString:strPicUrls]];
                    [self.retStImageViewBg addSubview:stImgView];
                });