如何缓存庞大的应用程序的组件

Question

我需要使用arround＆gt; 20个主视图和表单来设置一个非常庞大的应用程序。主视图至少包含一个网格，但最多可包含十个网格。还有一些包含Portal-Panel的主视图。

现在需要花费相当长的时间才能打开主视图，因为我只用一个而不是> 20来测试它。应用程序位于具有适合布局的视口中，该布局保存带有Borderlayout的容器。 Mainview始终在中心内呈现，而其他区域用于导航。

我的第一个方法 在tabpanel中缓存内容

我的第一个方法是使用带有隐藏标签的Tab-Panel。与此并行，我管理MixedCollection，如果View已插入tabpanel或必须创建，我将在其中进行查找。如果已经插入，我从MixedCollection中获取位置并运行setActiveTab()。但它似乎毫无价值，因为它需要所有相同的时间来插入新的主视图或使用setActiveTab（）激活现有的。

那么我做错了什么，我怎样才能做得更好？

修改

这个问题似乎来自于渲染时，每次使用setActiveTab（）时，该组件似乎都会被重新编译。将视图渲染到中心面板需要2-3秒。因此我认为我可以通过缓存已经创建的视图来加快速度，这样就不需要进行渲染和调整。我想我应该提一下，在北部地区，每次都会呈现一个菜单，但不会被追逐，但这不应该，不应该吗？

视图的切换方式

我有一个额外的控制器来管理menue-view和主视图的变化。为此，将menue从容器中移除并添加新的menue，并且对于主视图，如果已经创建了视图，则在所提到的混合集合中完成查找，如果是，则接收tab-index和tab活性。如果不是视图被添加为新选项卡，之后添加了它的ident和index到混合集合。

Answer 1

您可以帮助您查看 suspendLayouts() 和 resumeLayouts()

在开始更改视图之前运行Ext.suspendLayouts();，并在完成所有视图后运行Ext.resumeLayouts(true)。

您还应该检查是否过度，这意味着您已将多个组件嵌套到彼此中。

示例：

如果网格是tabpanel中唯一的组件，那么如果将该网格放在额外的面板中，然后放入tabpanel，则会过度。

Answer 2

首先，我发现无论如何都会填充非活动标签。我不知道为什么。但无论如何我的商店都没有加载活动标签。 其次，与你的应用程序的大小无关。我们有很多观点，一切都很快。 在大多数情况下，这取决于：

1. 首先是嵌套 - 检查您的代码。减少嵌套速度。例如，如果你不需要面板提供的所有东西 - 使用容器，而不是面板。因为所有这些东西都会为你的dom添加更多的div。
2. 取决于您创建视图的方式。没有你的代码，很难说，为什么它很慢。也许您每次打开标签或转到其他视图时都会创建视图。
3. 提到@sra尝试使用suspendLayouts - 这意味着您的浏览器只会渲染您的东西resumeLayouts，而不是每次添加任何组件时都会重新渲染所有内容。
4. 如果你使用windows - 使用closeAction：hide而不是destroy。
5. 不使用Ext.getCmp（）。我还听说refs会降低应用程序的速度，因为它们开始从正文中搜索你的组件。但它没有证明信息:)使用component.down（'id'），component.up（'xtype'）它只会从您的组件搜索而不是从正文中搜索。
6. 每次使用Ext.create（'Panel'）执行某些操作时，都不会从控制器创建视图。这意味着它每次都会创建。
7. 使用较少的全局事件，因为这也会减慢您的应用。

在没有代码的情况下，很难说你的问题是什么。这只是可以帮助你的几点。但我的建议是寻找嵌套以及创建视图的方式和位置。