OC底层探索(二十六)界面优化

正在注销账号

已于 2024-02-26 17:15:06 修改

阅读量398

点赞数

分类专栏： IOS 文章标签：界面优化

于 2020-11-28 01:39:23 首次发布

本文链接：https://blog.csdn.net/weixin_40918107/article/details/110251938

版权

界面卡顿的原理

由于iOS的渲染机制，会造成掉帧的情况，所以界面会卡顿。请参考文章浅谈图像撕裂问题及解决方法，此文章中就不过多的解释界面卡顿的原理了。

卡顿检测

1. YYKit库

YYKit下载地址

YYkit主要是使用CADisplayLink 绑定到runloop上进行监听渲染次数。

2. 监听runloop

监听runloop事物处理的时间，主要监听runloop的kCFRunLoopBeforeSources和kCFRunLoopAfterWaiting这两个状态值，如果监听到了超过两秒，说明页面产生了卡顿。

微信检测工具matrix：就是利用了此原理。

3. ping runloop

创建一个轮询，进行询问runloop是否在忙碌状态

滴滴检测工具 DoraemonKit

界面优化方案

1. 预排版

思路分析：开辟两个线程
- 网络请求的线程: 进行异步网络请求
- 预排版线程：提前计算好布局属性，比如根据内容动态设置高度、宽度等。
案例：

lineCellLayout

static const CGFloat nameLeftSpaceToHeadIcon = 10;
static const CGFloat titleFont = 15;
static const CGFloat msgFont = 15;
static const CGFloat msgExpandLimitHeight = 140;
static const CGFloat timeAndLocationFont = 13;

- (instancetype)initWithModel:(LGTimeLineModel *)timeLineModel{
   
    if (!timeLineModel) return nil;
    self = [super init];
    if (self) {
   
        _timeLineModel = timeLineModel;
        [self layout];
    }
    return self;
}

- (void)setTimeLineModel:(LGTimeLineModel *)timeLineModel{
   
    _timeLineModel = timeLineModel;
    [self layout];
}

- (void)layout{
   

    CGFloat sWidth = [UIScreen mainScreen].bounds.size.width;

    self.iconRect = CGRectMake(10, 10, 45, 45);
    CGFloat nameWidth = [self calcWidthWithTitle:_timeLineModel.name font:titleFont];
    CGFloat nameHeight = [self calcLabelHeight:_timeLineModel.name fontSize:titleFont width:nameWidth];
    self.nameRect = CGRectMake(CGRectGetMaxX(self.iconRect) + nameLeftSpaceToHeadIcon, 17, nameWidth, nameHeight);

    CGFloat msgWidth = sWidth - 10 - 16;
    CGFloat msgHeight = 0;

    //文本信息高度计算
    NSMutableParagraphStyle * paragraphStyle = [[NSMutableParagraphStyle alloc] init];
    [paragraphStyle setLineSpacing