2

レコードのリストを持つ 1 つの viewModel を持つ、かなり複雑なアプリがあります。

app.records = ko.observableArray([])

AJAX を使用して、サーバーから JSON を取得し、配列に詰め込みます。

$.getJSON("/api/records", function(data){
    app.records($.map(data, function(item){
      r = new Record(item);
      return r;
    });
});

これは、少なくとも私のテスト データセットの 6 つの項目ではうまく機能します。アプリはほぼ瞬時に読み込まれます。しかし、これを行う新しいレコードの作成ボタンもあります。

$.post("/api/records", {}, function(record){
    r = new Record(record);
    console.log("About to push...");
    app.records.push(r);
    console.log("Pushed the new record.");
});

最初のログ行はすぐに表示されますが、2 行目は表示されるまでに約 8 秒かかります。プッシュをコメントアウトすると、操作が事実上瞬時になります。問題は、私が持っているかなり複雑な計算変数のかなりの数から生じていると思います。プッシュにより、 EVERYTHINGが再計算されていると思います。それでも、奇妙なのは、ページの読み込み時に 6 つのテスト項目をすぐに追加できることです。

これをデバッグするためのヒントを教えてもらえますか? アプリは、コードを簡単に共有したり、問題を切り分ける JSFiddle を作成したりできる状態ではありません。何か問題が解決するかどうかを確認するためにやみくもに行をコメントアウトするのは気が進まない。時間がかかる可能性があるからだ。誰にもアイデアはありますか？それとも少なくとも一般的な戦略ですか？:)

(私は現在 2.1 リリース候補を使用しています。問題は Knockout 2.0 でも発生します。)

4

2 に答える 2

1

Niemeyer のブログのこの投稿を見てください: http://www.knockmeout.net/2012/04/knockoutjs-performance-gotcha.html

于 2012-06-14T12:36:06.627 に答える
0

まあ、計算されたオブザーバブルがパフォーマンスの問題を引き起こしているというあなたの理論は合理的なようです。「バイナリ検索」戦略を使用してそれらをコメントアウトすることは、問題を特定する最速の方法かもしれません。または、計算したすべてのオブザーバブルにロギングを追加できます。

于 2012-04-24T15:58:49.570 に答える