angular中关于ng-repeat的性能问题
2024-09-29 19:11:41
首先,ng-repeat的渲染是改变则渲染的。而且是无法自动检测内容是否改变的。
$scope作为一个对象,对象的特性就是两个对象是不相同的,因为我们比较的是两个对象的地址,即便两个对象的内容甚至排版完全相同,也是false;
基于此,我们只能自己来限制它无意义的渲染。
我在做一个即时聊天板块,用到的angular,期间需要轮询,所以自己搞了一些办法来提高性能。
首先,我比较了$scope中子属性的内容——$scope.names。而names是一个Array类型的。也是没办法直接比较的。此处用到数组比较的另一个方法,转字符串。看代码:
.success(function (data){
if(lianxiren != data.toString()){
lianxiren = data.toString();
$scope.names = data;
}
})
OK,很简单。如果一样,啥也不干,如果不同,先存起来,然后赋给names。
这样就完了吗?并不。
既然是即时聊天,聊个几十上百句都是毛毛雨,嗨皮了聊上几百句也是正常的。
辣么,每次都重复渲染是不是很烦?而且如果记录多了,更是耗时间。
不怕,有办法。
ng-repeat="x in names track by $index"
track by。
我们只需要给已经渲染过的条目加上一个唯一标识符就可以让angular识别出来了。而标识符的内容,我选择了$index。
其实只要是唯一的就可以,自由发挥。
最新文章
- 第三章 --- 关于Javascript 设计模式 之 代理模式
- Navicat常用快捷键
- [Uva 11825] Hackers’ Crackdown
- Shell if else语句
- HttpContext.Current.Cache 和 HttpRuntime.Cache 区别
- ANDROID定义自己的看法——onMeasure,MeasureSpec源代码 过程 思考具体解释
- Java中线程总结
- Beyas定理
- mp的猜猜看
- 使用php的curl爬去青果教务系统 课表(转)
- Bootstrap table方法,Bootstrap table事件,配置
- python待学习内容
- 关于element-ui resetFields
- 马凯军201771010116《面向对象程序设计(java)》第一周学习总结
- oracle sqlplus 回退键以及上下键
- 标准化数据-StandardScaler
- 使用synchronized wait() notifyall() 实现简单的加减法同步 竞争抢答
- js css等静态文件版本控制,一处配置多处更新.net版【原创】
- Windbg+Procdump解决w3wp.exe CPU过百问题
- linux:进程概念