• angular中关于ng-repeat的性能问题


    首先,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。

    其实只要是唯一的就可以,自由发挥。

  • 相关阅读:
    加签验签
    .net core三个生命周期
    List,IList,IEnumerable的区别
    IHttpClientFactory 模拟http请求
    TDengine在Linux下的安装
    Linux环境下安装jdk
    在 React 中使用 JSX 的好处
    React介绍(讲人话)
    React是什么,为什么要使用它?
    mac系统下给文件夹加密方法
  • 原文地址:https://www.cnblogs.com/yunzhexiaye/p/6306209.html
Copyright © 2020-2023  润新知