性能优化- SDWebImage 和 YYWebImage

主 Bundle 栏

Paste_Image.png

重点关注

**
表格的性能优化:
1.行高一定要缓存 ;
2.不要动态创建子视图 ;
<1>所有子视图都预先创建 ;
<2>如果不需要显示可以设置 hidden ;
3.所有子视图都应该添加到 contentView 上 ;
因为 cell 有一个功能就是侧滑可以调出删除按钮,或者添加选项等功能,如果我们的子视图不在 contentView 上到时候要是有这个侧滑的需求的话修改量很大!
4.所有子视图都必须指定背景颜色 ;
<1>UIView 的背景颜色不设置的话 push 推出的时候会卡顿 ;
<2>NavigationController 的背景颜色如果不设置右上角会有黑条阴影,用户体验不好
5.所有颜色都不要使用透明度 alpha ;
如果设置了透明度图层之间会有一个多层的渲染的过程,对性能的消耗非常大!尤其是 cell 里所有的颜色都不要使用 alpha,因为在快速滚动的时候,系统总想快速计算这个渲染的结果, 好让 cell 显示,这样的话运算量过大
6.cell 栅格化 ;
7.异步绘制 ;
**

ViewController.m 文件

#import "ViewController.h"
//@import SDWebImage ;
#import "YYWebImage.h"
//YYWebImage 如果需要播放动图,需要使用`YYAnimatedImageView`专门播放动图用的!
#import "MDTableViewCell.h"
NSString *const cellIdentifier = @"cellIdentifier" ;

@interface ViewController () 

@end

/**

    表格的性能优化:
    1.行高一定要缓存 ;
    2.不要动态创建子视图 ;
        <1>所有子视图都预先创建 ;
        <2>如果不需要显示可以设置 hidden ;
    3.所有子视图都应该添加到 contentView 上 ;
        因为 cell 有一个功能就是侧滑可以调出删除按钮,或者添加选项等功能,如果我们的子视图不在 contentView 上到时候要是有这个侧滑的需求的话修改量很大!
    4.所有子视图都必须指定背景颜色 ;
        <1>UIView 的背景颜色不设置的话 push 推出的时候会卡顿 ;
        <2>NavigationController 的背景颜色如果不设置右上角会有黑条阴影,用户体验不好
    5.所有颜色都不要使用透明度 alpha ;
        如果设置了透明度图层之间会有一个多层的渲染的过程,对性能的消耗非常大!尤其是 cell 里所有的颜色都不要使用 alpha,因为在快速滚动的时候,系统总想快速计算这个渲染的结果, 好让 cell 显示,这样的话运算量过大
    6.cell 栅格化 ;
    7.异步绘制 ;
 
 */
@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    [self prepareTableView] ;
    
}

#pragma mark - prepareTableView
- (void)prepareTableView {
    UITableView *tableView = [[UITableView alloc] initWithFrame:self.view.bounds style:UITableViewStylePlain] ;
    tableView.dataSource = self ;
    tableView.delegate = self ;
    [tableView registerClass:[MDTableViewCell class] forCellReuseIdentifier:cellIdentifier] ;
    tableView.rowHeight = 100 ;
    [self.view addSubview:tableView] ;
    
}

#pragma mark - 
- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView {
    return 1 ;
}

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
    return 100 ;
}

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:cellIdentifier forIndexPath:indexPath] ;
    NSURL *url = [NSURL URLWithString:@"http://imglf0.ph.126.net/WAAJPGdYwngSJ5_0nq6YAA==/6608699301143989092.gif"] ;
    UIImage *image = [UIImage imageNamed:@"avatar"] ;
    [cell.imageView yy_setImageWithURL:url placeholder:image] ;
//    [cell.imageView sd_setImageWithURL:url placeholderImage:image] ;
    return cell ;
}

/*
    要保证表格良好的用户体验,刷新帧率应该在50+才是高品质的动画~人眼识别24帧就已经是较好的动画效果了!
    真机测试要用`旧手机`才能测出性能!
 */

@end

重点关注

**
//Rasterize:栅格化 ;
self.layer.shouldRasterize = YES ;
//但是Rasterize栅格化之后 gif 图会有模糊的现象,
//所以Rasterize栅格化必须必须指定分辨率!!!
self.layer.rasterizationScale = [UIScreen mainScreen].scale ;
//2.异步绘制:
//UIKit 有一个特点,他的更新都是在主线程里更新的,这也是为什么主线程又被称为 UI 线程!
//apple 关于异步绘制的介绍非常少:
//这句话加上之后就可以实现异步绘制:
//apple 的官方文档提到过这个,只说了一句如果 cell 比较复杂可以使用,平时不建议使用~
self.layer.drawsAsynchronously = YES ;**

MDTableViewCell.m 文件

#import "MDTableViewCell.h"
#import "YYWebImage.h"
@implementation MDTableViewCell

- (instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier {
    self = [super initWithStyle:style reuseIdentifier:reuseIdentifier] ;
    if (self) {
        //如果不这么写的话是不能加载动图的,动图是不动的 ;
        //YYAnimatedImageView 是专门加载动图用的 ;
        //利用 KVC 来修改 imageView 的类型:
        /*
            @property (nonatomic, "readonly", strong, nullable) UIImageView *imageView NS_AVAILABLE_IOS(3_0);   // default is nil.  image view will be created if necessary.
         
            给 UITableViewCell 这个类的 imageView 属性做修改!把 imageView 属性修改为 YYAnimatedImageView 属性 ;
            imageView 属性是不能修改的,因为他是只读属性~所以只能用 KVC 方法:
         */
        
        [self setValue:[[YYAnimatedImageView alloc] init] forKey:@"imageView"] ;
        
        /**
         栅格化:美工术语 , 将 cell 中的所有内容 , 生成一张独立的图像 ;
         在滚动的过程中 , 我们并没有点击 cell 与 cell 交互,所以在滚动时,我们让 cell 整体变成一张图像,只显示这张图像 ;
         */
        //1.下面这两句话是让程序性能飞起来的`平凡之路`!!!
        //Rasterize:栅格化 ;
        self.layer.shouldRasterize = YES ;
        //但是Rasterize栅格化之后 gif 图会有模糊的现象,
        //所以Rasterize栅格化必须必须指定分辨率!!!
        self.layer.rasterizationScale = [UIScreen mainScreen].scale ;
        //2.异步绘制:
        //UIKit 有一个特点,他的更新都是在主线程里更新的,这也是为什么主线程又被称为 UI 线程!
        //apple 关于异步绘制的介绍非常少:
        //这句话加上之后就可以实现异步绘制:
        //apple 的官方文档提到过这个,只说了一句如果 cell 比较复杂可以使用,平时不建议使用~
        self.layer.drawsAsynchronously = YES ;
    }
    return self ;
}

@end

热爱分享,热爱开源