私は周りを見回しましたが、次の問題の優れた解決策をまだ見つけていません:
ページ上の el に結び付けられた Backbone View があります。これは、従来の意味で「サイドバー」と呼ぶもののコンテナー要素です (説明のため)。 この sidebar 要素の inner-html は、ルートによって完全に変更する必要があります。ただし、ページ上の位置は決して変わらず、常にこのコンテナを埋めます。
ここで、最初のプロトタイプとして、このコンテナとそこに配置されたビューの間に 1 対 1 の関係がありました (ルートを 1 つだけコード化しました)。ただし、前述のように、ルートに基づいてビューを変更する必要があります。
これらの異なるビューは、まったく異なる html マークアップ、イベントへの応答などを持っているということです。もちろん、すべてを同じビューで処理することも有効な解決策の 1 つですが、必要なロジックは扱いにくく (そしてかなり扱いにくく) なります。
現在、これが私が考えていることです(そして部分的に実装しています):
- このページ要素のトップレベル ビューを用意します。
- ルートに応じて、必要なサブビューをスワップします。
- これらのサブビューは、dust.js でレンダリングされ、ページ上のこのコンポーネントだけの .html テンプレートが AJAX を介して遅延ロードされ、コンパイルされ、キャッシュされます。後続のレンダリングは、キャッシュされた「コンパイル済み」関数を新しいコンテキストで呼び出すだけで構成されます。
- さらに、最上位ビュー内の各サブビュー ビューを初期化してキャッシュし、インスタンス化、イベント ハンドラーの設定などを 1 回だけ行うようにしました。
次に、ルートに応じて、関連するサブビュー ビュー (キャッシュされた) を検索し、現在のビューの代わりにスワップします。
今、私が述べたように、私はこれをほとんどコード化して... 半作業状態にしています。ただし、私が苦労しているのは、これらの各サブビューを独立して存在させ、スワッピングを処理する方法ですが、コンポーネントが現在表示されているかどうかに関係なく、すべてのイベントハンドラーと現在の状態を維持し続ける方法です。
基本的:
- サブビューが必要になるたびにサブビューを完全に破棄/再インスタンス化することを回避する方法。たぶん、この操作は私が考えているほど高価ではないので、単純に後者を実行する必要があります。
- 最上位のビュー (場合によっては「マネージャー」) がコンテナー $el に関連付けられているため、サブビューをスワップする方法。
シンプルでエレガントなソリューションがあると確信しています。残念ながら、私はまだそれを見つけていません。