3

我需要一个比内置的 knockout.js 更快的模板引擎。什么是最快的,你如何设置它?网上有例子吗?我一直在考虑 doT.js 或车把。我想等待 JsRender,但性能没有达到标准。

4

3 回答 3

3

我专门为快速表生成创建了一个绑定:https ://github.com/mbest/knockout-table 。

于 2013-01-31T20:08:45.130 回答
2

这个答案不再准确。Knockout 2.2 现在支持通过 foreach 绑定重新排序元素。

敲除的主要问题observableArray是所有修改数组的操作都会导致foreach绑定下的元素完全重新呈现。如果这成为性能瓶颈,您可以通过不移动行而是复制它们的值来解决这个问题。

在每次更改时重新渲染整个内容的明显方式foreach如下:

function Row(value) {
    this.value = value;
}
var model = {
    rows = ko.observableArray([new Row(1), new Row(2), new Row(3), new Row(4), new Row(5)])
}
function move(index, insertionIndex) {
    var rows = models.rows();
    // TODO Insert some clever code here
    // - remove row from rows array
    // - insert row at insertionIndex into rows array
    rows.valueHasMutated();
}

由于这将重绘整个表格,这可能不是您想要的。更好的方法是支持复制的可变 Row 元素:

function Row(value) {
    this.value = ko.observable(value);
}
Row.prototype.copyFrom(anotherRow) {
    this.value(anotherRow().value());
}
Row.prototype.swap(anotherRow) {
    var tmp = this.value();
    this.value(anotherRow.value());
    anotherRow.value(tmp);
}
var model = {
    rows = ko.observableArray([new Row(1), new Row(2), new Row(3), new Row(4), new Row(5)])
}
function move(index, insertionIndex) {
    var rows = models.rows();
    var tmp = new Row();
    tmp.copyFrom(rows[index]) // save the current row
    if (index < insertionIndex) {
        // move row down -> move other rows up
        for (var i=index; i<insertionIndex; i++) {
            rows[i].copyFrom(rows[i+1])
        }
    } else {
        // move row up -> move other rows down
        for (var i=index; i>insertionIndex; i--) {
            rows[i].copyFrom(rows[i-1])
        }
    }
}

请注意,您不再需要使用 ,rows.valueHasMutated()因为您不是在修改数组而是更改Row对象。因此foreach绑定不会更新,您只会重新呈现更改的行。

如果淘汰赛能够提供更强大observableArrayforeach绑定的处理程序实现,而不需要在更改时重新呈现整个模板,那将是很酷的。在那之前,如果您想坚持使用 Knockout,这是您最好的选择。

于 2013-01-31T16:43:51.547 回答
1

我发现了这个错误,http://bugs.jqueryui.com/ticket/6757,并且有人回答了另一个修复它的问题。

Knockout.js 和大型数据集也使下拉列表变慢

于 2013-11-15T19:47:03.560 回答