GIF最佳緩存方式

可能存在的問題場景

  1. 直播項目中多個GIF圖播放不及時釋放會占用內存
  2. 直播項目中多個GIF讀取有可能導致短時間CPU占用率高

加載GIF的方式主要有兩種:

  1. 原生加載
    // 一幀一幀的圖片組成數組去加載
    self.redImgView.animationImages = [self imgDataList];
    self.redImgView.animationDuration = 1;
    self.redImgView.animationRepeatCount = 1;
    [self.redImgView startAnimating];
  1. 第三方FLAnimatedImage加載
    // 把多張圖片組成GIF,加載GIF
    NSData *data = [NSKeyedArchiver archivedDataWithRootObject:_imgNameList];
    FLAnimatedImage *image = [[FLAnimatedImage alloc] initWithAnimatedGIFData:data];
    self.redImgView.animatedImage = image;

建議選用FLAnimatedImage加載GIF,具體原因可參考源碼或者網上其它解釋,這里暫時只討論緩存方式

一、100張圖片通過沙盒讀取,imageWithContentsOfFile轉成UIImage:

-(void)bundleLoadMuch {
    NSLog(@"第一種方案:開始讀取");
    for (int index = 0; index != 101; index++) {
        @autoreleasepool {
            NSString *imageName = [NSString stringWithFormat:@"live_level_star_%02d", index];
            NSString *imagePath = [[NSBundle mainBundle] pathForResource:imageName ofType:@"png"];
            NSData *data = [NSData dataWithContentsOfFile:imagePath];
            [_imgDataList addObject:data];
        }
    }
    NSLog(@"第一種方案:完成讀取");
}
第一種CPU占用率和時間.png

二、把多張圖片合并成GIF,再讀?。?/h3>
-(void)bundleLoadOneGif {
    NSLog(@"第二種方案:開始讀取");
    if (1) {
        _imgDataList = [[NSMutableArray alloc] init];
        NSString *imagePath = [[NSBundle mainBundle] pathForResource:@"gifhome_200x200" ofType:@"gif"];
        NSData *data = [NSData dataWithContentsOfFile:imagePath];
        [_imgDataList addObject:data];
    }
    NSLog(@"第二種方案:完成讀取");
}
第二種CPU占用率和時間.png

三、把多張圖片合并成Webp,再讀?。?/h3>
-(void)bundleLoadOneWebp {
    NSLog(@"第三種方案:開始讀取");
    if (1) {
        _imgDataList = [[NSMutableArray alloc] init];
        NSString *imagePath = [[NSBundle mainBundle] pathForResource:@"start" ofType:@"webp"];
        NSData *data = [NSData dataWithContentsOfFile:imagePath];
        [_imgDataList addObject:data];
    }
    NSLog(@"第三種方案:完成讀取");
}
第三種CPU占用率和時間.png

三種方案測試數據:
第一種方案執(zhí)行時間為30ms,CPU占用率為48%
第二種方案執(zhí)行時間為2ms,CPU占用率為25%
第三種方案執(zhí)行時間為1ms,CPU占用率為7%

結論:
優(yōu)先使用讀取一個文件(GIF或者WebP)的方式,第二種方案和第三種方案的區(qū)別,我理解應該為文件大小的區(qū)別,同樣的一個動圖,WebP圖是要比GIF圖小

WebP:WebP是Google近幾年推出的新型網絡圖片格式,有靜態(tài)和動態(tài)兩種類型,其中靜態(tài)webp比jpg和png的壓縮率都要大,而且失真率接近于png,遠勝于jpg,因為他支持8位的透明通道。在無損壓縮的情況下,比png要小28%左右。而動態(tài)webp比gif好了不止一兩點,gif只支持2位的透明通道,而且圖片鋸齒嚴重。

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
【社區(qū)內容提示】社區(qū)部分內容疑似由AI輔助生成,瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發(fā)布,文章內容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

友情鏈接更多精彩內容