13

複雑な流星アプリを持っているという、おそらくそれほどユニークではない問題があります。

実際には必要のないページの一部を更新するアクションがいくつかあります。しかし、どの find() (または複数の find() ) がトリガーされているかを特定するのに苦労しています。問題のコレクションは知っていますが、どの find() かはわかりません。

使用するすべての検索でobserveChangesを使用できますが、それは多くの余分なコードになります.

何がトリガーされ、何がトリガーされているかを確認する簡単な方法はありますか?

ありがとう！

4

2 に答える 2

19

便利なレンダー ロギング関数を次に示します。各テンプレートがコンソールにレンダリングされた回数を記録します。最初のページの読み込み後にテンプレートが再レンダリングされる場合、それはテンプレートが依存するリアクティブ データ ソースが変更されたためです。このリアクティブ データ ソースがヘルパー メソッドでアクセスされた可能性があります。または、テンプレートがリスト アイテム ({{#each ...}}ブロック ヘルパー内) であり、リスト アイテムが追加/移動/削除/変更された可能性があります。また、子テンプレートは、子がレンダリングまたは再レンダリングされるときに、親のレンダリングされたコールバックを呼び出すことに注意してください。したがって、親が実際に DOM から取り除かれ、元に戻されたと考えると混乱するかもしれませんが、そうではありません。

したがって、クライアント コードの最後でこの関数を呼び出して、レンダリング カウントを確認できます。

  function logRenders () {
    _.each(Template, function (template, name) {
      var oldRender = template.rendered;
      var counter = 0;

      template.rendered = function () {
        console.log(name, "render count: ", ++counter);
        oldRender && oldRender.apply(this, arguments);
      };
    });
  }

編集: これは、検索カーソルをラップして、カーソルへのすべての変更をコンソールに記録する方法です。これと同様の関数を、reactive-vision と呼ばれる作業中の新しいパッケージ用に作成しました。うまくいけば、すぐにリリースされます。

var wrappedFind = Meteor.Collection.prototype.find;

Meteor.Collection.prototype.find = function () {
  var cursor = wrappedFind.apply(this, arguments);
  var collectionName = this._name;

  cursor.observeChanges({
    added: function (id, fields) {
      console.log(collectionName, 'added', id, fields);
    },

    changed: function (id, fields) {
      console.log(collectionName, 'changed', id, fields);
    },

    movedBefore: function (id, before) {
      console.log(collectionName, 'movedBefore', id, before);
    },

    removed: function (id) {
      console.log(collectionName, 'removed', id);
    }
  });

  return cursor;
};
于 2013-03-16T01:30:25.860 に答える
0

アイデアをくれた@cmatherに感謝します。

彼女はMeteor 1.3適応され、より高度なバージョンですlogRenders

// Log all rendered templates
// If filter is set, only templates in filter will be logged
// @params filter - name or names of template to filter
logRenders = function logRenders (filter) {
  for (name in Object(Template)){
    if (filter && !Array.isArray(filter)) filter = [filter];
    var template = Template[name];
    if (!template) continue;
    if (filter && filter.indexOf(name) == -1){
      // Clear previous logRenders
      if ('oldRender' in template) template.rendered = template.oldRender;
      delete template.oldRender;
      continue;
    }
    var t = function(name, template){
      if (!('oldRender' in template)) template.oldRender = template.rendered;
      var counter = 0;
      template.rendered = function () {
        console.log(name, ++counter, this);
        this.oldRender && this.oldRender.apply(this, arguments);
      };
    }(name, template);
  };
};
于 2016-05-08T00:43:41.173 に答える