1

我需要设置一个相当大的应用程序，其中包含超过 20 个主视图和表单。一个主视图至少包含一个网格，但最多可以包含十个网格。还有一些包含门户面板的主视图。

现在它需要相当长的时间才能打开一个主视图，这不会发生，因为我只用一个而不是 > 20 对其进行了测试。应用程序放置在具有适合布局的视口中，该视口包含具有边框布局的容器。Mainview 总是在中心呈现，而其他区域用于导航。

我的第一种方法 是在标签面板中缓存东西

我的第一种方法是使用带有隐藏选项卡的选项卡面板。与此并行的是，MixedCollection如果视图已被插入到选项卡面板中或必须创建，我将在其中进行查找。如果它已经被插入，我从 MixedCollection 中获取位置并运行setActiveTab(). 但这似乎毫无价值，因为插入新主视图或使用 setActiveTab() 激活现有主视图需要所有时间。

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

编辑

问题似乎来自渲染时间，并且每次使用 setActiveTab() 时组件似乎都会重新渲染。将视图渲染到中心面板最多需要 2-3 秒。因此，我认为我可以通过缓存已经创建的视图来加速它，这样就不需要进行渲染和调整大小。我想我应该提一下，在北部地区，每次也会呈现一个菜单，这不会受到影响，但这不重要，不是吗？

如何切换视图

我有一个额外的控制器来管理菜单视图和主视图更改。为此，从容器中删除菜单并添加新菜单，对于主视图，如果已创建视图，则在上述混合集合中进行查找，如果已创建，则接收选项卡索引和选项卡活性。如果不是，则将视图添加为新选项卡，然后将其标识和索引添加到混合集合中。

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 - 使用 closeAction:hide 而不是销毁。
  5. 不使用 Ext.getCmp()。我还听说 refs 会减慢应用程序的速度，因为它们开始从正文中搜索您的组件。但它没有证明信息:) 使用 component.down('id'), component.up('xtype') 它只会从您的组件而不是正文中搜索。
  6. 每次使用 Ext.create('Panel') 执行某些操作时，不要从控制器创建视图。这意味着它将每次创建。
  7. 使用较少的全局事件，因为这也会减慢您的应用程序。

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

于 2012-12-11T21:42:15.577 回答