记一次TableView优化经历

![可怜](
data:image/jpeg;base64,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)

本来上传了一张tableView的图片到百度,没想到百度居然说只限百度用户内部交流使用,靠。

先说一下刚开始的实现思路吧,一开始使用的Xib+AutoLayout,以及iOS8之后的自动估算高度。也就是设置 
self.ableView.estimatedRowHeight = xxx;
self.tableView.rowHeight = UITableViewAutomaticDimension;
选择这种实现方式非常适合快速开发,快速的拖拽控件就可以很快的看见效果。

如果能这么顺利的解决问题,那就不会有这篇博客了。我们遇到的问题是,当切换到其他tabbarItem时,切换回首页之后,滑动tableView之后发现掉帧,而且很严重。

这种问题其实是使用预估高度必然会出现的问题,预估的高度和实际高度不一致,当cell滑动时,会调用很多次计算高度的方法,不停的在计算,fps必然会低于60,也就产生了用户所看到的跳帧。

解决思路:

  1. 缓存高度。
  2. self.ableView.estimatedRowHeight的值设置屏幕最终显示cell中实际高度最低的那个的高度值。

既然要缓存高度,首先需要得到cell的真实高度

- (void)tableView:(UITableView *)tableView didEndDisplayingCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath 
{
  NSString *key = [NSString stringWithFormat:@"%ld",    (long)indexPath.row];
  [self.heightDict setObject:@(cell.height) forKey:key];
  DEBUG_LOG(@"第%@行的计算的最终高度是%f",key,cell.height);
}

didEndDisplayingCell是cell已经被真正的显示在了屏幕上,所以在这里打印出的高度必然是最正确的高度。根据indexPath.row作为key,将高度缓存进字典。拿字典做容器的好处还有就是取出速度更快。底层是用hash表实现的。如果有人对hash表想深入研究的话,推荐看这篇文章。

下面就是如果字典里有值,则使用缓存高度,否则自动计算。

- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
{
    NSString *key = [NSString stringWithFormat:@"%ld",indexPath.row];
    if (self.heightDict[key] != nil) {
       NSNumber *value = _heightDict[key];
       DEBUG_LOG(@"%@行的缓存下来的高度是%f",key,value.floatValue);
       return value.floatValue;
    }
    return UITableViewAutomaticDimension;
}

最后提醒一句:设置cell的预估高度时一定要设置最小高度cell的那个值。不然的话,在滑动的时候,当高度最小的那个滑动到一大半的时候,就会突然一下消失,造成掉帧。对于这个问题我并没有深入的去研究,但是把预估高度设置成最小的那个高度就可以解决这个问题。如果有人知道的话可以在底下留言。

喜欢的话就点个吧。

你可能感兴趣的:(记一次TableView优化经历)