TableView 优化笔记

0. 前言

TableView 的优化是一个老生常谈的问题,无论是自己平常使用,还是面试笔试的时候,它都会无时不刻地出现。TableView 需要优化的问题主要有这几个:

  • 列表巨长
    一般我们的 TableView 都会展示比较多的数据,尤其是请求网络的时候,都是哗啦啦的一个大列表。
  • 图片巨多
    如果是哗啦啦的大列表,每一个 cell 都带图片的话,帧率咔咔地往下掉...
  • 圆角巨多
    哗啦啦的大列表,加上图片,然后图片还得要是个圆形... 完了以后就是一堆圆角矩形的 label ...
  • 高度巨乱
    万一你的 TableView 每一个 cell 的高度还都不一样...

这个笔记就当作是一个小总结,把上面这几个问题给小小地解决一下。今天先把思路写出来,挖好坑再填 Demo 和代码... 就是这么懒...


1. 列表巨长

不管是剁手宝的搜索列表,还是知乎的主页流,都是需要展示非常长的列表。如果一下子全部加载进来,就算只有文字,界面也会卡住。万一网络环境再差一点,整个体验就烂到爆。所以一般在处理 TableView 的时候,都会先考虑 上拉加载

上拉加载有两种实现的思路,一种是上拉到 列表底部 然后通过动画告知用户正在加载,一种是上拉到 靠近列表底部的某一个位置 然后预加载。第一种思路本身没有什么问题,但是如果列表真的很长,那用户就会看到很多次加载动画,会造成一点体验的割裂感,我自己不是很喜欢。第二种思路能够给用户一种比较顺畅的感觉,但是当用户滑动太快或者网络不是很好的时候,有可能预加载还没完成就滑到底了... 所以这个时候最好是也加上一个加载动画,以免造成用户的体验困惑。

如果想采用第一种思路但是自己又懒得写的话,可以用 ESPullToRefresh 来实现,这是一个很棒的框架。ESPullToRefresh 的 GitHub 传送门


2. 图片巨多

TableView 的图片是一个逃不掉的话题。如果每一个 cell 都包含了一张图片,而且是实时加载的话,TableView 的滑动很大可能会掉帧。

所以聪明的人类想出了一个解决办法——忽略加载。就是说滑动的时候那些新来的图片我就不加载,等到你停住了不滑动了,我再加载出来给你看。这个解决的思路尤其在快速滑动的时候非常好,因为如果用户是快速滑动的话,那意味着他很大程度上对这些滑过去的内容是不感兴趣的,他需要的是更下面的内容。


3. 圆角巨多

圆角得分两种情况来说,一种是 UIView 的圆角,一种是 UIImageView/UILabel 的圆角。两种圆角的区别在于,如果用最原生的方式 cornerRadius 设置圆角半径的话,UIImageView 和 UILabel 是需要用 maskToBounds() 方法来给它们上遮罩的,但是 UIView 不需要。也就是说,如果你是需要给 UIView 画圆角那就直接设置 cornerRadius 好了,这个不会造成什么卡顿。

而针对 UIImageView 和 UILabel,聪明的人类又想出了一个特别作弊的办法——圆角图片。就是直接画一张带圆角的中间镂空的图片给你叠上去... 简直就是作弊... 可能有人会说,固定大小的是可以,那如果是长度不同的 UILabel 怎么办咧。方法就是,你就左右各一张嘛... (逃...)


4. 高度巨乱

像朋友圈这样,cell 的行高是跟每个用户发布的内容有关系,所以每个 cell 的行高就不得不计算。不定行高也是 TableView 优化不能不解决的问题。解决的办法就是——缓存。


5. 小结

TableView 是一个特别可恨的东西... 因为毕竟全世界都在为它的这些使用场景做优化,非常期待水果在某一天能够给出一个官方的解决方案或者直接写好方法(没错就是这么懒)...

还有一个非常重要的点,一定要根据情况来定制具体方案。
如果 TableView 不长那么分页加载来干什么...
如果圆角不多,只是掉个一两帧那有什么好优化的...

作为一个程序员,一定要... 懒... [手动狗头] [手动狗头] [手动狗头]

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 214,444评论 6 496
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 91,421评论 3 389
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 160,036评论 0 349
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 57,363评论 1 288
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 66,460评论 6 386
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 50,502评论 1 292
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,511评论 3 412
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,280评论 0 270
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,736评论 1 307
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,014评论 2 328
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,190评论 1 342
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,848评论 5 338
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,531评论 3 322
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,159评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,411评论 1 268
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 47,067评论 2 365
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,078评论 2 352

推荐阅读更多精彩内容

  • 发现 关注 消息 iOS 第三方库、插件、知名博客总结 作者大灰狼的小绵羊哥哥关注 2017.06.26 09:4...
    肇东周阅读 12,080评论 4 62
  • 杨先生去遥远的地方和钱先生及他们的女儿相聚,共聚《我们仨》了,先生一路走好! 仅以先生语录勉励自我。 这让我想到“...
    小青love阅读 287评论 0 0
  • 昨天写排序算法的时候遇到一个问题:将交换两个数的几句代码定义成一个静态方法,需要交换数字的时候调用这个方法,结果排...
    buyaole阅读 555评论 1 0
  • 我不知道我需要通过什么方式来保留记忆吗?记日记?写几天就没什么写了。难道我期待有一天翻出来看到的惊喜?以前的许多事...
    bingo_wonder阅读 375评论 0 0
  • 现在是十点57分 我喜欢的人睡着了吧,能有个好梦吧。晚安,我的铁马,我的冰河 今天我在后操场抱着你,风挺大,可是,...
    小凡日记阅读 283评论 0 0