ios整理(六)关于用富文本在tableview的cell去加载html字符串的优化方案

简介: ios整理(六)关于用富文本在tableview的cell去加载html字符串的优化方案1.相信用iOS系统的类去加载html字符串很多人第一反应就是NSString *contens = @"1231我给你数点这里";NSData *data = [contens dataUsingEncod...

ios整理(六)关于用富文本在tableview的cell去加载html字符串的优化方案
1.相信用iOS系统的类去加载html字符串很多人第一反应就是

NSString *contens = @"1231我给你数点这里";
NSData *data = [contens dataUsingEncoding:NSUnicodeStringEncoding];
NSDictionary *options = @{NSDocumentTypeDocumentAttribute: NSHTMLTextDocumentType};
NSMutableAttributedString *attr = [[NSMutableAttributedString alloc] initWithData:data options:options documentAttributes:nil error:nil];
然后后面的就是直接将attr这个对象赋值给lab或者textView这样的控件就能展示了,苹果提供的API就是这个。

然而我要说的是在反复的intiWithData的时候它是比较耗费内存性能的,你可以尝试的去把他放在tableview里面的cell去加载,你会发现滚动起来后通过cell复用机制去加载会使UI界面变得卡顿,那么为什么会造成这种原因呢?通过反复的去验证,我发现反复的intiWithData确实挺爆内存的,后来就找原因。

网上也看过别人写的一个优化的方案,很直接的就是你可以异步开辟子线程去加载这个attr然后在主线程去赋值,这样就可以了。

复制代码
// 获取全局并发队列
dispatch_queue_t queue = dispatch_get_global_queue(DISPATCH_QUEUE_PRIORITY_DEFAULT, 0);
// 获取主队列
dispatch_queue_t mainQueue = dispatch_get_main_queue();
dispatch_async(queue, ^{

contents = [contents stringByReplacingOccurrencesOfString:@"\n" withString:@"<br>"];
NSData *data = [content dataUsingEncoding:NSUnicodeStringEncoding];
NSDictionary *options = @{NSDocumentTypeDocumentAttribute: NSHTMLTextDocumentType};
NSMutableAttributedString *attr = [[NSMutableAttributedString alloc] initWithData:data options:options documentAttributes:nil error:nil];
[attr addAttribute:NSFontAttributeName value:[UIFont systemFontOfSize:17] range:NSMakeRange(0, attr.length)];
//回主线程刷新ui
dispatch_async(mainQueue, ^{
     //给UI控件赋值
     self.lab.attr = attr;
});

});
复制代码
类似于这种,可以减少内存使用率让UI不卡顿。但是这种情况下你要考虑是否适合当前的场景,例如你创建的这个cell是根据富文本里面的高度去计算的,那么你就得仔细考虑一下了,上面这段代码是通过异步进行加载的,那么的话你要计算出高度的话就得异步去拿高度,但是当异步拿到高度的时候你cell很有可能已经创建完了,时机没办法同步。而且当你高度拿到后再进行reloadData刷新的话,那么整个tableview是会重新布局的,那么又会去重新计算,这样会出现闪屏的现象,那么废话说了那么,原因就是因为它加载的时候转换的contens内容不多或者只initWithData一两次还好,但是cell的滚动复用会让他多次加载,因此不能放在cell创建的时候去执行。

下面是我个人的思路,有其他想法的可以提出来一起交流:

1.如果cell里面加载会反复执行这段代码的话,就会消耗内存及卡顿UI,那么我在cell创建前提前做好这个事情,让他不需要initWithData多次。

在模型的.h里面创建attr属性

@interface TestModel : NSObject
@property (strong,nonatomic) NSMutableAttributedString *attr;
@end
在.m里去做刚才的这一步,那么就是说当请求数据结束后再进行富文本的转换在赋值给模型保存,而不是创建cell的时候去加载富文本

复制代码

  • (instancetype)initModelWithDict:(NSDictionary *)dict {
    //初始化
    id obj = [[self alloc] init];
    //字典转模型
    [obj setValuesForKeysWithDictionary:dict];
    //转富文本
    if (contens) {

    NSData *data = [contens dataUsingEncoding:NSUnicodeStringEncoding];
    NSDictionary *options = @{NSDocumentTypeDocumentAttribute: NSHTMLTextDocumentType};
    NSMutableAttributedString *attr = [[NSMutableAttributedString alloc] initWithData:data options:options documentAttributes:nil error:nil];
    [attr addAttribute:NSFontAttributeName value:[UIFont systemFontOfSize:17] range:NSMakeRange(0, attr.length)];
    model.attr = attr;

    }
    return obj;
    }

复制代码
那么,模型走完这一步再去刷新reloadData 那么cell加载的时候就可以直接将model里的attr给cell里面的lab或者textView控件的attr就行了,每次就是从模型里面去取值,这样性能就会好点。

后面要计算高度可以冲模型里面取到attr对象,然后根据lab或者textView调用系统的计算布局就行,下面的经供参考

CGFloat labH = [self.lab boundingRectWithSize:CGSizeMake(375, MAXFLOAT) options:NSStringDrawingUsesLineFragmentOrigin attributes:attr context:nil].size.height;
原文地址https://www.cnblogs.com/wm941142146/p/10653266.html

相关文章
|
6月前
|
JavaScript 前端开发 开发者
Vue 动态添加 HTML 元素组件封装使用方法及长尾关键词优化指南
本文详细介绍了Vue中动态添加HTML元素的使用方法与组件封装技巧。内容涵盖条件渲染(v-if/v-show)、列表渲染(v-for)、动态组件(:is)、手动操作DOM及动态创建组件实例等核心方法。同时,通过动态表单、弹窗组件和动态加载组件的封装示例,展示如何提升代码复用性和可维护性。最后,总结性能优化策略与注意事项,如批量更新DOM、懒加载大型组件及避免直接操作DOM等,帮助开发者在实际项目中灵活应用Vue动态元素管理功能。
183 15
|
6月前
|
JavaScript 前端开发 开发者
Vue 动态添加 HTML 元素组件封装使用方法及长尾关键词优化指南
本文详细介绍了Vue中动态添加HTML元素的多种方法与组件封装技巧,涵盖条件渲染(v-if/v-show)、列表渲染(v-for)、动态组件(:is)、手动DOM操作及动态创建组件实例等内容。同时提供了性能优化建议,如批量更新DOM、使用v-show代替v-if以及懒加载大型组件等。通过合理封装组件,可提高代码复用性和维护性。文中还附有具体示例代码,帮助开发者更好地理解和应用相关技术。适用于前端开发人员学习和实践Vue动态元素处理与组件设计。
167 19
|
编解码 前端开发 UED
HTML多媒体格式支持与优化
在HTML中,多媒体格式的支持与优化至关重要。使用`&lt;audio&gt;`、`&lt;video&gt;`和`&lt;img&gt;`标签可分别嵌入音频、视频和图像。支持的格式包括MP3、OGG、JPEG等。为优化体验,应压缩文件、采用响应式设计、使用懒加载,并考虑转码及CDN托管。此外,添加字幕和描述文件可提高辅助功能。遵循这些最佳实践,能显著提升多媒体内容的加载速度与用户满意度。
|
7月前
|
前端开发 JavaScript API
Webview+Python:用HTML打造跨平台桌面应用的创新方案
本文系统介绍了使用PyWebView库结合HTML/CSS/JavaScript开发跨平台桌面应用的方法。相比传统方案(如PyQt、Tkinter),PyWebView具备开发效率高、界面美观、资源占用低等优势。文章从技术原理、环境搭建、核心功能实现到性能优化与实战案例全面展开,涵盖窗口管理、双向通信、系统集成等功能,并通过“智能文件管理器”案例展示实际应用。适合希望快速构建跨平台桌面应用的Python开发者参考学习。
818 1
|
10月前
|
前端开发 JavaScript
【02】v1.0.1更新增加倒计时完成后的放烟花页面-优化播放器-优化结构目录-蛇年新年快乐倒计时领取礼物放烟花html代码优雅草科技央千澈写采用html5+div+CSS+JavaScript-优雅草卓伊凡-做一条关于新年的代码分享给你们-为了C站的分拼一下子
【02】v1.0.1更新增加倒计时完成后的放烟花页面-优化播放器-优化结构目录-蛇年新年快乐倒计时领取礼物放烟花html代码优雅草科技央千澈写采用html5+div+CSS+JavaScript-优雅草卓伊凡-做一条关于新年的代码分享给你们-为了C站的分拼一下子
297 14
【02】v1.0.1更新增加倒计时完成后的放烟花页面-优化播放器-优化结构目录-蛇年新年快乐倒计时领取礼物放烟花html代码优雅草科技央千澈写采用html5+div+CSS+JavaScript-优雅草卓伊凡-做一条关于新年的代码分享给你们-为了C站的分拼一下子
|
12月前
|
前端开发 测试技术 定位技术
如何利用HTML和CSS构建企业级网站的全过程。从项目概述到页面结构设计,再到HTML结构搭建与CSS样式设计,最后实现具体页面并进行优化提升,全面覆盖了网站开发的关键步骤
本文深入介绍了如何利用HTML和CSS构建企业级网站的全过程。从项目概述到页面结构设计,再到HTML结构搭建与CSS样式设计,最后实现具体页面并进行优化提升,全面覆盖了网站开发的关键步骤。通过实例展示了主页、关于我们、产品展示、新闻动态及联系我们等页面的设计与实现,强调了合理布局、美观设计及用户体验的重要性。旨在为企业打造一个既专业又具吸引力的线上平台。
464 7
|
12月前
|
存储 移动开发 前端开发
高效的 HTML 与 CSS 编写技巧,涵盖语义化标签、文档结构优化、CSS 预处理、模块化设计、选择器优化、CSS 变量、媒体查询等内容
本文深入探讨了高效的 HTML 与 CSS 编写技巧,涵盖语义化标签、文档结构优化、CSS 预处理、模块化设计、选择器优化、CSS 变量、媒体查询等内容,旨在提升开发效率、网站性能和用户体验。
337 5
|
搜索推荐 前端开发 UED
哪些 HTML 全局属性在 SEO 优化中比较重要?
【10月更文挑战第27天】这些HTML全局属性通过不同的方式为搜索引擎提供了更丰富、准确的页面信息,有助于提高页面的可索引性、相关性和用户体验,从而在SEO优化中发挥着重要的作用。开发者应充分重视并合理运用这些属性,以提升网站在搜索引擎中的排名和流量。
169 12
|
前端开发 搜索推荐 算法
|
移动开发 编解码 监控
HTML5 Video(视频)作为背景的优化方案
使用 HTML5 `&lt;video&gt;` 标签作为网页背景视频可以提升视觉效果,但需优化以确保性能和用户体验。主要方法包括:选择合适的视频格式(MP4、WebM、Ogg)和分辨率(720p 或更低),压缩文件大小,确保视频静音和循环播放,使用 CSS 设置全屏样式,根据设备和网络条件加载视频或静态图像,使用 `playsinline` 属性和延迟加载技术提高性能,确保无障碍性,并监控页面加载时间。合理应用背景视频可增强网站视觉效果而不影响用户体验。

热门文章

最新文章

下一篇
oss云网关配置