1

約 20 を超えるメイン ビューとフォームを備えた非常に巨大なアプリケーションをセットアップする必要があります。メインビューには少なくとも 1 つのグリッドが含まれますが、最大 10 のグリッドを含めることができます。Portal-Panel を含むいくつかのメインビューもあります。

> 20ではなく1つだけでテストしたので、メインビューが開くまでにかなりの時間がかかるようになりました。アプリケーションは、Borderlayout のコンテナーを保持するフィット レイアウトの Viewport 内に配置されます。Mainview は常に中央にレンダリングされ、他の領域はナビゲーションに使用されます。

タブパネル内で物事をキャッシュする私の最初のアプローチ

私の最初のアプローチは、非表示のタブを持つタブ パネルを使用することでした。MixedCollectionそれと並行して、ビューがすでにタブパネルに挿入されているか、作成する必要がある場合にルックアップを行う場所を管理します。既に挿入されている場合は、MixedCollection から位置をフェッチし、setActiveTab(). しかし、新しいメインビューを挿入したり、setActiveTab() を使用して既存のメインビューをアクティブにしたりするのに同じ時間がかかるため、価値がないように思えます。

では、私が間違っていることは何ですか?どうすればこれを改善できますか?

編集

問題はレンダリング時間にあるようで、setActiveTab() が使用されるたびにコンポーネントが再レンダリングされるようです。ビューを中央パネルにレンダリングするには、最大 2 ～ 3 秒かかります。したがって、レンダリングとサイズ変更を行う必要がないように、既に作成されたビューをキャッシュすることで高速化できると考えました。北部地域ではメニューも毎回レンダリングされることを言及する必要があると思いますが、これはキャッシュされませんが、それは問題ではありませんね。

ビューの切り替え方法

メニュービューとメインビューの変更を管理する追加のコントローラーがあります。そのため、メニューがコンテナーから削除され、新しいメニューが追加されます。ビューが既に作成されている場合は、メインビューの場合、前述の混合コレクションでルックアップが行われ、その場合はタブインデックスが受信され、タブアクティブ化されました。そうでない場合、ビューは新しいタブとして追加され、その後、ident と index と共に混合コレクションに追加されます。

4

2 に答える 2

2

suspendLayouts()とresumeLayouts( )を見ると役立つ場合があります

Ext.suspendLayouts();ビューの変更を開始する前とExt.resumeLayouts(true)、すべてのビューを完了した後に実行します。

また、ネストしすぎていないかどうかも確認する必要があります。つまり、多くのコンポーネントが互いにネストされていることを意味します。

例：

グリッドがタブパネル内の唯一のコンポーネントである場合、そのグリッドを追加のパネルに配置してからタブパネルに配置すると、ネストしすぎます。

于 2012-12-11T08:25:30.133 に答える
1

まず、非アクティブなタブがとにかく読み込まれることがわかりました。どうしてか分かりません。しかし、アクティブでないタブのストアはとにかくロードされました。次に、アプリのサイズは問題ではありません。多くのビューがあり、すべてが非常に高速に動作します。ほとんどの場合、依存します:

  1. 最初はネストです - コードを見直してください。ネスティングを減らして速度を上げます。たとえば、パネルが提供するすべてのものを必要としない場合は、パネルの代わりにコンテナを使用します。これはすべて、dom に div を追加するためです。
  2. ビューの作成方法によって異なります。コードがなければ、なぜ遅いのかを言うのは本当に難しいです。タブを開くたびにビューを作成したり、別のビューに移動したりすることがあります。
  3. 言及したように、@sraはsuspendLayoutsを使用しようとします-これは、コンポーネントを追加するたびにすべてを再レンダリングするのではなく、ブラウザーがresumeLayoutsのみをレンダリングすることを意味します。
  4. Windows を使用している場合は、destroy の代わりに closeAction:hide を使用してください。
  5. Ext.getCmp() を使用しないでください。また、refs は body からコンポーネントの検索を開始するため、アプリケーションの速度が低下する可能性があると聞いています。しかし、それは情報を証明していません:) component.down('id'), component.up('xtype') を使用すると、本体からではなく、コンポーネントからのみ検索されます。
  6. Ext.create('Panel') を使用して何かを行うたびに、コントローラーからビューを作成しないでください。それは毎回作成されることを意味します。
  7. これもアプリの速度を低下させるため、使用するグローバル イベントを減らします。

コードなしであなたのケースで何が問題なのかを言うのは本当に難しいです。これはあなたを助けることができるほんの数点です. しかし、ネストと、ビューを作成する方法と場所を検討することをお勧めします。

于 2012-12-11T21:42:15.577 に答える