对于1000+ <div>元素</div>,ko.observableArray()非常慢

时间:2013-01-02 15:15:01

标签: jquery knockout.js

请参阅我的jsfiddler示例。

http://jsfiddle.net/cYYEt/

如果还有另一种方式我们应该绑定/创建我们的数组/ etc也可以。我通过使用列表或跨度

解决了这个问题

谢谢!

JS

var mainViewModel = function () {
    var self = this;

    this.Items = ko.observableArray();

    this.init = function () {
        var itemsArray = [];
        for(var i = 0; i < 1300; i++){
            itemsArray.push("My value is: " + i);
        }
        self.Items(itemsArray );
    };
};

$(function () {
    myApp = new mainViewModel();
    ko.applyBindings(myApp);
    myApp.init();
});​

HTML

<!-- ko foreach: Items -->
    <div data-bind="text: $data"></div>
<!-- /ko -->​

1 个答案:

答案 0 :(得分:17)

通过删除“模板”周围的文本节点,您可以在Chrome中获得不错的改进:http://jsfiddle.net/rniemeyer/RAfNv/

<!-- ko foreach: Items --><div data-bind="text: $data"></div><!-- /ko -->

我认为我们将在某个时候寻求在核心中改进这一点。我们之前已经看过类似的内容:https://github.com/SteveSanderson/knockout/pull/709,但此时并未最终添加任何更改。