1

大規模な単一ページのバックボーン JS アプリケーションを開発しています。ユーザーが特定のハッシュの場所に移動すると、バックボーンルーターがビューをロードし、基本的に特定のバックボーンビューでイベント「表示」をトリガーし、他のすべてのビューと $( this.el) が表示されます。

基本的に最終的には、数百のビューが表示され、それらを切り替えると同じことが行われ、アクティブなビュー div が非表示になり、クリックしたリンクに対応する次のビューが表示されます (リンクはすべてハッシュタグの場所です)。

非アクティブ/非表示のビューのイベントを無効にしたり委任を解除したりするメリットはありますか? 現在、すべてのビューはすでにインスタンス化されており、「表示」または「非表示」イベントをトリガーする準備ができていますが、非表示のビューですべての DOM 関連イベントを無効にするだけで、メモリ/パフォーマンスがより効果的になる可能性があると考えています。非表示のビューが使用しているモデルまたはコレクションもバインド解除します。

ユーザーがアクティブなビューから新しいビューに切り替えたときに起動し、すべてのイベントを無効にしてから div を非表示にする「クリーンアップ」トリガーを用意することを考えていましたが、必要ですか、それとももっと良い方法がありますか?メモリ使用量を減らし、パフォーマンスを向上させますか?

4

2 に答える 2

0

ビュー内の非表示または不要になったすべてのイベントのバインドを確実に解除する必要があります。モデルまたはコレクションにバインドするビューについて考えてみてください。ビューが表示されず、モデルで何かが変更されました。ビューは DOM を更新しますが、変更は表示されません。

DOM イベントのバインド解除は、ビューを削除する場合にのみ意味があるため、ガベージ コレクターは DOM 要素を削除できます。まだイベントがバインドされている場合は、メモリ リークが発生する可能性があります。

Marionetteフレームワークがこれを処理する方法を見てみましょう。ビューのcloseメソッドでは、モデル/コレクションにバインドされたすべてのイベントのバインドを解除し、DOM へのすべてのイベントのバインドを解除します。

また、本当にそんなに多くのビューを節約したいかどうかについても考える必要があります。あなたが得るメモリの問題ではありません。その一貫地獄についてです。すべてのビューがモデルのすべての変更を取得し、それらが表示されていなくても自己更新することを確認する必要があります。いくつかの大規模な単一ページ アプリに取り組んでいると、ビューを保存するよりもビューを再レンダリングする方がはるかに優れていると言えます。

于 2012-09-22T21:34:16.373 に答える
0

私がこれに使用する解決策は、DOM で一種のビューを 1 つだけ保持することです。すなわち:

3 つのビューがあるとします。

var MainView = Backbone.View.extend({
  el: '#main-view',

  events: {
    "click .openView1":   "openView1",
    "click .openView2":   "openView2"
  },

  render: function() {
    //...
  },

  openView1: {
      this.activeView = new View1();
  },

  openView2: {
      this.activeView = new View2();
  }
});

var View1 = Backbone.View.extend({
});

var View2 = Backbone.View.extend({
});

アクティブなビューを 1 つの変数に保存する場合、メモリの問題は発生しません。

于 2012-09-22T17:35:24.783 に答える