Profiling observableArray

Question

我想在KnockoutJS中分析一个observableArray，看看在KnockoutJS中填充和呈现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>

从结果生成的图I

​

​

Answer 1

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

我会做一个小的修订，像这样，因为您对创建可观测值所需的时间不感兴趣。但是，这一次可以忽略不计，并且只会为您的分析添加一个很小的(如果有的话)常数。

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