[iOS开发]UITableView的性能优化

一些基础的优化

（一）CPU

1. 用轻量级对象

比如用不到事件处理的地方，可以考虑使用 CALayer 取代 UIView

CALayer * imageLayer = [CALayer layer];
imageLayer.bounds = CGRectMake(0,0,200,100);
imageLayer.position = CGPointMake(200,200);
imageLayer.contents = (id)[UIImage imageNamed:@"xx.jpg"].CGImage;
imageLayer.contentsGravity = kCAGravityResizeAspect;
[tableCell.contentView.layer addSublayer:imageLayer];

2. 不要频繁地调用UIView的相关属性

比如 frame、bounds、transform 等属性，尽量减少不必要的修改
不要给UITableViewCell动态添加subView，可以在初始化UITableViewCell的时候就将所有需要展示的添加完毕，然后根据需要来设置hidden属性显示和隐藏

3. 提前计算好布局

在滑动时，会不断调用heightForRowAtIndexPath:，当Cell高度需要自适应时，每次回调都要计算高度，会导致UI卡顿。为了避免重复无意义的计算，需要缓存高度。
UITableViewCell高度计算主要有两种，一种固定高度，另外一种动态高度。
固定高度：
rowHeight高度默认44
对于固定高度直接采用self.tableView.rowHeight = 77比tableView:heightForRowAtIndexPath:更高效
动态高度：
采用tableView:heightForRowAtIndexPath:这种代理方式，设置这种代理之后rowHeight则无效，需要满足以下三个条件

  • 使用Autolayout进行UI布局约束（要求cell.contentView的四条边都与内部元素有约束关系）
  • 指定TableView的estimatedRowHeight属性的默认值
  • 指定TableView的rowHeight属性为UITableViewAutomaticDimension
self.tableView.rowHeight = UITableViewAutomaticDimension;
self.tableView.estimatedRowHeight = 44;

除了提高cell高度的计算效率之外，对于已经计算出的高度，我们需要进行缓存

4. 直接设置frame

Autolayout 会比直接设置 frame 消耗更多的 CPU 资源

5. 图片尺寸合适

图片的 size 最好刚好跟 UIImageView 的 size 保持一致
图片通过contentMode处理显示，对tableview滚动速度同样会造成影响
从网络下载图片后先根据需要显示的图片大小切/压缩成合适大小的图，每次只显示处理过大小的图片，当查看大图时在显示大图。
服务器直接返回预处理好的小图和大图以及对应的尺寸最好

/// 根据特定的区域对图片进行裁剪
+ (UIImage*)kj_cutImageWithImage:(UIImage*)image Frame:(CGRect)cropRect{return ({CGImageRef tmp = CGImageCreateWithImageInRect([image CGImage], cropRect);UIImage *newImage = [UIImage imageWithCGImage:tmp scale:image.scale orientation:image.imageOrientation];CGImageRelease(tmp);newImage;});
}

6. 控制最大并发数量

控制一下线程的最大并发数量，当下载线程数超过2时，会显著影响主线程的性能。可以用一个NSOperationQueue来维护下载请求，并设置其最大线程数maxConcurrentOperationCount。
当然在不需要响应用户请求时，也可以增加下载线程数来加快下载速度：

- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate{if (!decelerate) self.queue.maxConcurrentOperationCount = 5;
}
- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView{self.queue.maxConcurrentOperationCount = 5;
}
- (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView{self.queue.maxConcurrentOperationCount = 2;
}

7. 子线程处理

尽量把耗时的操作放到子线程

  • 文本处理（尺寸计算、绘制）
  • 图片处理（解码、绘制）

8. 异步绘制

异步绘制，就是异步在画布上绘制内容，将复杂的绘制过程放到后台线程中执行，然后在主线程显示。

// 异步绘制，切换至子线程
dispatch_async(dispatch_get_global_queue(0, 0), ^{UIGraphicsBeginImageContextWithOptions(size, NO, scale);CGContextRef context = UIGraphicsGetCurrentContext();// TODO:draw in context...CGImageRef imgRef = CGBitmapContextCreateImage(context);UIGraphicsEndImageContext();dispatch_async(dispatch_get_main_queue(), ^{self.layer.contents = imgRef;});
});

请添加图片描述

（二）GPU

1. 避免短时间内大量显示图片

尽可能将多张图片合成一张进行显示。

2. 控制尺寸

GPU能处理的最大纹理尺寸是4096x4096，超过这个尺寸就会占用CPU资源进行处理，所以纹理尽量不要超过这个尺寸。

3. 减少图层混合操作

当多个视图叠加，放在上面的视图是半透明的，那么这个时候GPU就要进行混合，把透明的颜色加上放在下面的视图的颜色混合之后得出一个颜色再显示在屏幕上，这一步是消耗GPU资源

  • UIView的backgroundColor不要设置为clearColor，最好设置和superView的backgroundColor颜色一样
  • 图片避免使用带alpha通道的图片

4. 透明处理

减少透明的视图，不透明的就设置opaque = YES

5. 避免离屏渲染

离屏渲染就是在当前屏幕缓冲区以外，新开辟一个缓冲区进行操作。离屏渲染的整个过程，需要多次切换上下文环境，先是从当前屏幕切换到离屏；等到离屏渲染结束以后，将离屏缓冲区的渲染结果显示到屏幕上，又需要将上下文环境从离屏切换到当前屏幕。

(1)下面的情况或操作会引发离屏渲染
  • 光栅化，layer.shouldRasterize = YES
  • 遮罩，layer.mask
  • 圆角，同时设置 layer.masksToBounds = YES 和 layer.cornerRadius > 0
  • 阴影，layer.shadow
  • layer.allowsGroupOpacity = YES 和 layer.opacity != 1
  • 重写drawRect方法
(2)圆角优化

这里主要其实就是解决同时设置layer.masksToBounds = YES 和 layer.cornerRadius > 0就会产生的离屏渲染。其实我们在使用常规视图切圆角时，可以只使用view.layer.cornerRadius = 3.0，这时是不会产生离屏渲染。但是UIImageView有点特殊，切圆角时必须上面2句同时设置，则会产生离屏渲染，所以我们可以考虑通过 CoreGraphics 绘制裁剪圆角，或者叫美工提供圆角图片。

- (UIImage *)billy_ellipseImage {UIGraphicsBeginImageContextWithOptions(self.size, NO, 0.0);CGContextRef ctx = UIGraphicsGetCurrentContext();CGRect rect = CGRectMake(0, 0, self.size.width, self.size.height);CGContextAddEllipseInRect(ctx, rect);CGContextClip(ctx);[self drawInRect:rect];UIImage *image = UIGraphicsGetImageFromCurrentImageContext();UIGraphicsEndImageContext();return image;
}

此外，还可以通过贝塞尔曲线画圆角：

- (void)clipCornerWithImageView:(UIImageView *)originViewandTopLeft:(BOOL)topLeftandTopRight:(BOOL)topRightandBottomLeft:(BOOL)bottomLeftandBottomRight:(BOOL)bottomRightcornerRadius:(CGFloat)radius
{CGRect rect = originView.bounds;UIBezierPath *maskPath = [UIBezierPath bezierPathWithRoundedRect:rect cornerRadius:radius];// 创建遮罩层CAShapeLayer *maskLayer = [[CAShapeLayer alloc] init];maskLayer.frame = rect;maskLayer.path = maskPath.CGPath;   // 轨迹originView.layer.mask = maskLayer;
}- (void)clipCornerWithImageView:(UIImageView *)originViewcornerRadius:(CGFloat)radius {CGRect rect = originView.bounds;UIBezierPath *maskPath = [UIBezierPath bezierPathWithRoundedRect:rect byRoundingCorners:UIRectCornerAllCorners cornerRadii:CGSizeMake(radius, radius)];// 创建遮罩层CAShapeLayer *maskLayer = [[CAShapeLayer alloc] init];maskLayer.frame = rect;maskLayer.path = maskPath.CGPath;   // 轨迹originView.layer.mask = maskLayer;
}

这样还可以控制特定角是否设置圆角。这种情况有个弊端，就是切割角度有限，所以实现大角度圆角只能采取自己画线的方式来操作。

(3)阴影优化

对于shadow，如果图层是个简单的几何图形或者圆角图形，我们可以通过设置shadowPath来优化性能，能大幅提高性能。

imageView.layer.shadowColor = [UIColor grayColor].CGColor;
imageView.layer.shadowOpacity = 1.0;
imageView.layer.shadowRadius = 2.0;
UIBezierPath *path = [UIBezierPath bezierPathWithRect:imageView.frame];
imageView.layer.shadowPath = path.CGPath;
(4)强制开启光栅化

当图像混合了多个图层，每次移动时，每一帧都要重新合成这些图层，十分消耗性能，这时就可以选择强制开启光栅化layer.shouldRasterize = YES。
当我们开启光栅化后，会在首次产生一个位图缓存，当再次使用时候就会复用这个缓存，但是如果图层发生改变的时候就会重新产生位图缓存。
所以这个功能一般不能用于UITableViewCell中，复用反而降低了性能。最好用于图层较多的静态内容的图形。

(5)优化建议
  • 使用中间透明图片蒙上去达到圆角效果
  • 使用ShadowPath指定layer阴影效果路径
  • 使用异步进行layer渲染
  • 将UITableViewCell及其子视图的opaque属性设为YES，减少复杂图层合成
  • 尽量使用不包含透明alpha通道的图片资源
  • 尽量设置layer的大小值为整形值
  • 背景色的alpha值应该为1，例如不要使用clearColor
  • 直接让美工把图片切成圆角进行显示，这是效率最高的一种方案
  • 很多情况下用户上传图片进行显示，可以让服务端处理圆角

加载图片的特殊需求

对于没有大型项目经验的我，很难触碰到设备的性能瓶颈，可是未来接触的项目里需要处理的数据会有很多，可能会有各种特殊的需求，比如要求实现： 1. 要求 `tableView` 滚动的时候，滚动到哪行，哪行的图片才加载并显示，滚动过程中图片不加载显示; 2. 页面跳转的时候，取消当前页面的图片加载请求；

先来看看一般的加载逻辑，放一段我之前写过的项目的代码：
请添加图片描述

如上设置，如果我们有20行cell，页面启动的时候，直接滑动到最底部，20个cell都进入过了界面，- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath 这个方法就会被调用20次，不符合需求1。
为此，我学习了一下，学习到了两个解决方案，并自己动手实践了一下：

Runloop的小技巧

runloop - 两种常用模式介绍: trackingMode && defaultRunLoopMode

  • 默认情况 - defaultRunLoopMode
  • 滚动时候 - trackingMode

滚动的时候，进入trackingMode，这会导致defaultMode下的任务会被暂停，停止滚动的时候再次进入defaultMode并继续执行defaultMode下的任务。
代码：

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"cell"];if (!cell) {cell = [[UITableViewCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:@"cell"];}DemoModel *model = self.datas[indexPath.row];cell.textLabel.text = model.text;if (model.iconImage) {cell.imageView.image = model.iconImage;} else {cell.imageView.image = [UIImage imageNamed:@"placeholder.png"];[self performSelector:@selector(billy_loadImgeWithIndexPath:)withObject:indexPathafterDelay:0.0inModes:@[NSDefaultRunLoopMode]];}return cell;
}//下载图片，并渲染到cell上显示
- (void)billy_loadImgeWithIndexPath:(NSIndexPath *)indexPath {DemoModel *model = self.datas[indexPath.row];UITableViewCell *cell = [self.tableView cellForRowAtIndexPath:indexPath];[ImageDownLoadManager runloop_loadImageWithModel:model success:^{//主线程刷新UIdispatch_async(dispatch_get_main_queue(), ^{cell.imageView.image = model.iconImage;//[cell layoutSubviews];});}];
}

其他办法

我们可以手动判断UITableView的状态，保存下载任务，然后决定执行哪些下载任务或者在适当的时机取消这些任务。

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"cell"];if (!cell) {cell = [[UITableViewCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:@"cell"];}DemoModel *model = self.datas[indexPath.row];cell.textLabel.text = model.text;if (model.iconImage) {cell.imageView.image = model.iconImage;} else {cell.imageView.image = [UIImage imageNamed:@"placeholder.png"];//        [self performSelector:@selector(billy_loadImgeWithIndexPath:)
//                   withObject:indexPath afterDelay:0.0
//                      inModes:@[NSDefaultRunLoopMode]];//拖动的时候不显示if (!tableView.dragging && !tableView.decelerating) {//下载图片数据[self billy_loadImgeWithIndexPath:indexPath];}}return cell;
}

- (void)billy_loadImgeWithIndexPath:(NSIndexPath *)indexPath {DemoModel *model = self.datas[indexPath.row];//保存当前正在下载的操作ImageDownLoadManager *manager = self.imageLoadDic[indexPath];if (!manager) {manager = [[ImageDownLoadManager alloc] init];//开始加载-保存到当前下载操作字典中[self.imageLoadDic setObject:manager forKey:indexPath];}[manager loadImageWithModel:model success:^{//主线程刷新UIdispatch_async(dispatch_get_main_queue(), ^{UITableViewCell *cell = [self.tableView cellForRowAtIndexPath:indexPath];cell.imageView.image = model.iconImage;[cell layoutSubviews];});//加载成功-从保存的当前下载操作字典中移除[self.imageLoadDic removeObjectForKey:indexPath];}];
}

- (void)billy_loadImage {//拿到界面内-所有的cell的indexpathNSArray *visableCellIndexPaths = self.tableView.indexPathsForVisibleRows;for (NSIndexPath *indexPath in visableCellIndexPaths) {DemoModel *model = self.datas[indexPath.row];if (model.iconImage) {continue;}[self billy_loadImgeWithIndexPath:indexPath];}
}

- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate {if (!decelerate) {//直接停止-无动画[self billy_loadImage];}
}
- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView{[self billy_loadImage];
}

界面消失：

- (void)viewWillDisappear:(BOOL)animated{[super viewWillDisappear:animated];NSArray *loadImageManagers = [self.imageLoadDic allValues];//当前图片下载操作全部取消[loadImageManagers makeObjectsPerformSelector:@selector(cancelLoadImage)];
}

下面附上我demo的地址：https://github.com/BillyMiracle/TableViewImgLoadOptimization。欢迎大家下载一起学习。

先写这么多吧，学习的道路还长着呢。。。

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.hqwc.cn/news/234898.html

如若内容造成侵权/违法违规/事实不符，请联系编程知识网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

智能优化算法应用：基于旗鱼算法无线传感器网络(WSN)覆盖优化 - 附代码

智能优化算法应用：基于旗鱼算法无线传感器网络(WSN)覆盖优化 - 附代码

智能优化算法应用：基于旗鱼算法无线传感器网络(WSN)覆盖优化 - 附代码 文章目录 智能优化算法应用：基于旗鱼算法无线传感器网络(WSN)覆盖优化 - 附代码1.无线传感网络节点模型2.覆盖数学模型及分析3.旗鱼算法4.实验参数设定5.算法结果6.参考文献7.MATLAB…
阅读更多...
sqli-labs(9)

sqli-labs(9)

45. 不会显示报错信息通过or 1验证 在密码处输入)or(1 登录成功 )union select 1,2,3 # )union select 1,database(),3 # )union select 1,(select group_concat(table_name) from information_schema.tables where table_schemasecurity),3 # )union select 1,(select gro…
阅读更多...
Java 多线程循环打印

Java 多线程循环打印

文章目录 一、标志变量 互斥锁二、标志变量 synchronized三、标志变量 互斥锁 条件变量四、原子变量五、信号量 一、标志变量 互斥锁 标志变量用于标识当前应该是哪个线程进行输出，互斥锁用于保证对标志变量的互斥访问。 public class Main {private static …
阅读更多...
推荐几款免费的智能AI伪原创工具

推荐几款免费的智能AI伪原创工具

在当今信息快速传播的时代，创作者们常常为了在激烈的竞争中脱颖而出而苦苦挣扎，而其中的一项挑战就是创作出独具创意和独特性的内容。然而，时间有限的现实让很多人望而却步。在这个背景下，免费在线伪原创工具成为了创作者们的得力…
阅读更多...
抑制过拟合——Dropout原理

抑制过拟合——Dropout原理

抑制过拟合——Dropout原理 Dropout的工作原理 实验观察 在机器学习领域，尤其是当我们处理复杂的模型和有限的训练样本时，一个常见的问题是过拟合。简而言之，过拟合发生在模型对训练数据学得太好，以至于它捕捉到了数据中的噪声和…
阅读更多...
MacOS + Android Studio 通过 USB 数据线真机调试

MacOS + Android Studio 通过 USB 数据线真机调试

环境：Apple M1 MacOS Sonoma 14.1.1 软件：Android Studio Giraffe | 2022.3.1 Patch 3 设备：小米10 Android 13 一、创建测试项目 安卓 HelloWorld 项目: 安卓 HelloWorld 项目 二、数据线连接手机 1. 手机开启开发者模式 参考&#xff1…
阅读更多...
Jmeter+ant+jenkins实现持续集成看这一篇就搞定了！

Jmeter+ant+jenkins实现持续集成看这一篇就搞定了！

jmeterantjenkins持续集成 一、下载并配置jmeter 首先下载jmeter工具，并配置好环境变量；参考：https://www.cnblogs.com/YouJeffrey/p/16029894.html jmeter默认保存的是.jtl格式的文件，要设置一下bin/jmeter.properties,文件内容…
阅读更多...
【前端】多线程 worker

【前端】多线程 worker

VUE3 引用 npm install worker-loader 在vue.config.js文件的defineConfig里加上配置参数 chainWebpack: config > {config.module.rule(worker-loader).test(/\.worker\.js$/).use({loader: worker-loader,options: {inline: true}}).loader(worker-loader).end()}先在…
阅读更多...
传教士与野人过河问题

传教士与野人过河问题

代码模块参考文章：传教士与野人过河问题（numpy、pandas）_python过河问题_醉蕤的博客-CSDN博客 问题描述 一般的传教士和野人问题（Missionaries and Cannibals）：有N个传教士和C个野人来到河边准 备渡河。…
阅读更多...
EasyMicrobiome-易扩增子、易宏基因组等分析流程依赖常用软件、脚本文件和数据库注释文件

EasyMicrobiome-易扩增子、易宏基因组等分析流程依赖常用软件、脚本文件和数据库注释文件

啥也不说了，这个好用，给大家推荐：YongxinLiu/EasyMicrobiome (github.com) 大家先看看引用文献吧，很有用：https://doi.org/10.1002/imt2.83 还有这个，后面马上介绍：YongxinLiu/EasyAmplicon: E…
阅读更多...
mabatis基于xml方式和注解方式实现多表查询

mabatis基于xml方式和注解方式实现多表查询

前面步骤 http://t.csdnimg.cn/IPXMY 1、解释 在数据库中，单表的操作是最简单的，但是在实际业务中最少也有十几张表，并且表与表之间常常相互间联系； 一对一、一对多、多对多是表与表之间的常见的关系。 一对一：一张…
阅读更多...
zookeeper 单机伪集群搭建简单记录（实操课程系列）

zookeeper 单机伪集群搭建简单记录（实操课程系列）

本系列是zookeeper相关的实操课程，课程测试环环相扣，请按照顺序阅读测试来学习zookeeper 1、官方下载加压后，根目录下新建data和log目录，然后分别拷贝两份，分别放到D盘，E盘，F盘 2、data目录下面…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023