AngularJS在约2000元的渲染很慢? [英] AngularJS really slow at rendering with about 2000 elements?

查看:461
本文介绍了AngularJS在约2000元的渲染很慢?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

这里的小提琴:
http://jsfiddle.net/D5h7H/7/

它呈现以下内容:

<div ng-repeat="group in Model.Groups">
    <span>{{group.Name}}</span>
    <div ng-repeat="filter in group.Filters">
        <input type="checkbox" ng-model="filter.enabled">{{filter.Name}}
        <select ng-disabled="!filter.enabled">
            <option ng-repeat="value in filter.Values">{{value}}</option>
        </select>
    </div>
</div>

它的是在JSON装载从服务器,然后呈现给用户的过滤器(在一个例子JSON在小提琴生成右那里)的列表。目前有6组,在每个30滤波器为每个滤波器选项15元。

It's a list of filters that is loaded in json from the server and then rendered to the user (in an example json is generated right there in Fiddle). At the moment there are 6 groups of 30 filters in each with 15 option elements for each filter.

在Firefox中,现在大约需要2秒重绘UI。

In Firefox it now takes about 2 seconds to redraw the UI.

这是时间确定为角JS?有什么我做错了造成2秒。渲染(原因2000元看起来并不大的号码给我,但2秒。肯定是很大的)?

Is this time ok for angular js? Is there anything I'm doing wrong that caused 2sec. rendering (cause 2000 elements doesn't look as a big number to me, but 2sec. is certainly big)?

推荐答案

在AngularJS 1.3+,还有的 一次性结合 内置:

In AngularJS 1.3+, there is One-time binding built-in:

一次性结合前pression的主要目的是提供一种方法来
  创建绑定,获取注销和释放资源一次
  结合稳定。前减少pressions次数为
  看着使得消化循环更快,并允许更多的信息,以便
  同时显示。

The main purpose of one-time binding expression is to provide a way to create a binding that gets deregistered and frees up resources once the binding is stabilized. Reducing the number of expressions being watched makes the digest loop faster and allows more information to be displayed at the same time.

为了使一次性绑定,prePEND 来绑定值:

In order to make the one-time binding, prepend :: to the binding value:

<div>{{::name}}</div> 

另见相关讨论:

  • Angular JS - Render value without data-binding
  • Databinding in angularjs
  • Genuinely stop a element from binding - unbind an element - AngularJS

这篇关于AngularJS在约2000元的渲染很慢?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆