TableView基础性能优化

作为一个iOSer，有一个永远无法绕过的槛：tableView。

PS:此文适用于每一个cell返回高度不一样时

前文

在学习的开发道路上，tableView是第一个让我感到痛苦的控件，当时也是花了很长时间才对他有一丝了解
随着姿势水平的提升，个人对其有了更多的理解，现如今网络上有很多相关文章，我只是说出自己的一些观点，并尽量简要明了

---

正文

tableView主要方法

• 和性能有关的方法主要是2个：- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath和- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
• tableView继承与UIScrollView，创建一个scrollView需要contentSize值，所以通过第一个方法得到完全高度；第二个方法创建cell

---

tableView常见问题

对于新手创建tableView时，容易出现的一些常见问题：

• 在cellForRowAtIndexPath方法中创建cell，并布局cell中的控件及赋值；在heightForRowAtIndexPath方法中，UITableViewCell *cell = [tableView cellForRowAtIndexPath:indexPath]; return cell.size.height;

• 在heightForRowAtIndexPath中对所有控件进行布局计算，然后得出相应高度

在容易出现的两个问题中，都在heightForRowAtIndexPath方法中有大量的计算，无疑会对tableView的刷新造成巨大影响，使得用户滑动出现卡帧，体验感下降

---

tableView方法执行顺序

- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
{
    NSLog(@"----heightForRowAtIndexPath----");
    
}

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    NSLog(@"----cellForRowAtIndexPath--%ld",indexPath.row);
    
}

• 运行程序后，得到的NSLog打印信息

2017-03-15 15:57:08.336 RAC-MVVM实战(1)[9902:584636] ----heightForRowAtIndexPath----
2017-03-15 15:57:08.336 RAC-MVVM实战(1)[9902:584636] ----heightForRowAtIndexPath----
2017-03-15 15:57:08.336 RAC-MVVM实战(1)[9902:584636] ----heightForRowAtIndexPath----
2017-03-15 15:57:08.337 RAC-MVVM实战(1)[9902:584636] ----heightForRowAtIndexPath----
2017-03-15 15:57:08.339 RAC-MVVM实战(1)[9902:584636] ----heightForRowAtIndexPath----
2017-03-15 15:57:08.340 RAC-MVVM实战(1)[9902:584636] ----heightForRowAtIndexPath----
2017-03-15 15:57:08.340 RAC-MVVM实战(1)[9902:584636] ----heightForRowAtIndexPath----
2017-03-15 15:57:08.341 RAC-MVVM实战(1)[9902:584636] ----heightForRowAtIndexPath----
2017-03-15 15:57:08.341 RAC-MVVM实战(1)[9902:584636] ----heightForRowAtIndexPath----
2017-03-15 15:57:08.342 RAC-MVVM实战(1)[9902:584636] ----heightForRowAtIndexPath----
2017-03-15 15:57:08.342 RAC-MVVM实战(1)[9902:584636] ----heightForRowAtIndexPath----
2017-03-15 15:57:08.349 RAC-MVVM实战(1)[9902:584636] ----cellForRowAtIndexPath--0
2017-03-15 15:57:08.349 RAC-MVVM实战(1)[9902:584636] ----heightForRowAtIndexPath----
2017-03-15 15:57:08.350 RAC-MVVM实战(1)[9902:584636] ----heightForRowAtIndexPath----
2017-03-15 15:57:08.351 RAC-MVVM实战(1)[9902:584636] ----cellForRowAtIndexPath--1
2017-03-15 15:57:08.354 RAC-MVVM实战(1)[9902:584636] ----heightForRowAtIndexPath----
2017-03-15 15:57:08.355 RAC-MVVM实战(1)[9902:584636] ----heightForRowAtIndexPath----

• 滑动tableView得到的打印信息

2017-03-15 15:58:39.213 RAC-MVVM实战(1)[9902:584636] ----cellForRowAtIndexPath--2
2017-03-15 15:58:39.216 RAC-MVVM实战(1)[9902:584636] ----heightForRowAtIndexPath----
2017-03-15 15:58:39.216 RAC-MVVM实战(1)[9902:584636] ----heightForRowAtIndexPath----
2017-03-15 15:58:43.371 RAC-MVVM实战(1)[9902:584636] ----cellForRowAtIndexPath--3
2017-03-15 15:58:43.374 RAC-MVVM实战(1)[9902:584636] ----heightForRowAtIndexPath----
2017-03-15 15:58:43.374 RAC-MVVM实战(1)[9902:584636] ----heightForRowAtIndexPath----
2017-03-15 15:58:43.697 RAC-MVVM实战(1)[9902:584636] ----cellForRowAtIndexPath--4
2017-03-15 15:58:43.700 RAC-MVVM实战(1)[9902:584636] ----heightForRowAtIndexPath----
2017-03-15 15:58:43.700 RAC-MVVM实战(1)[9902:584636] ----heightForRowAtIndexPath----
2017-03-15 15:58:44.555 RAC-MVVM实战(1)[9902:584636] ----cellForRowAtIndexPath--5
2017-03-15 15:58:44.557 RAC-MVVM实战(1)[9902:584636] ----heightForRowAtIndexPath----
2017-03-15 15:58:44.557 RAC-MVVM实战(1)[9902:584636] ----heightForRowAtIndexPath----

---

得出结论

• tableView会先执行完所有高度方法，再执行屏幕显示cell的创建方法和对应的两次高度方法

---

解决方案

• 解决上述问题，只需将大量计算从tableView的deletegate和DataSource的方法中移除，最好是在请求数据成功的时候，计算出每一个cell高度并保存起来，刷新tableView走返回高度方法时直接用。

---

一个小技巧

• 现在请求数据成功时，大家都会model化数据，以便于更加方便扩展和管理
• 可以再加一个frameModel，顾名思义--将所有控件通过数据进行计算布局并保存
• 附上一个GitHub地址https://github.com/rayonCheng/MVVM-RAC-Test.git中的HomePage
• 此文章是介绍MVVM-RAC结合使用，不太理解的同学可以跳过RAC，只看数据处理