剖析KnockoutJS observableArray

Question

我想在KnockoutJS中分析observableArray，看看它在HTML中填充和呈现observableArray需要多长时间。

我计划使用下面的旧学校方法。我从中获得的结果是否准确？或者有更好的方法来进行这种分析

的JavaScript

    var arr = [],
        itemCount = 200;

    for (var i = 0; i < itemCount; i++) {
        arr.push('item ' + i);
    }

    var t1 = new Date();
    var viewModel = {
        items: ko.observableArray(arr),
        vmName: ko.observable('View Model')
    };

    ko.applyBindings(viewModel);
    var t2 = new Date();


    console.log(t2 - t1); //Shows the time in milliseconds 

HTML     

<div data-bind="foreach: items">
    <div data-bind="html: $data"></div>
</div>

我从结果中生成的图表

Answer 1

如图所示，这基本上是正确的方法。这是因为ko.applyBindings是同步调用。见这里：is ko.applyBindings synchronous or asynchronous?

我会做一个小修改，就像这样，因为你对分析创建observable所花费的时间不感兴趣。但是，这个时间可以忽略不计，只会在您的分析中添加一小部分（如果有的话）。

var viewModel = {
    items: ko.observableArray(arr),
    vmName: ko.observable('View Model')
};

var t1 = new Date();
ko.applyBindings(viewModel);
var t2 = new Date();


console.log(t2 - t1); //Shows the time in milliseconds