extjs4 - 使用 ExtJS 生成大约一千个或更多的控件

标签 extjs4

我们已经决定将 ExtJS 用于我们的大型应用程序的 web-remake 之一,我们将不得不生成屏幕/表单,我们将不得不在表单的完整可编辑网格中呈现大约一千个或更多的控件。

那么我可以知道这样做的最佳方法是什么吗?

我已经尝试生成大约一千个控件,它在客户端需要大约 6 秒多的时间,这也将取决于客户端配置,我确信它至少是双核系统的时间。

但是本地主机上超过 6 秒就像互联网上的 10 秒,所以我很担心,当负载很高时我仍然可以选择混合普通的 html 表单/控件,但它会错过 ExtJS 触摸(组合/数字控件等),所以如果您有任何帮助或有类似经验,请分享。

在上述情况下,XTemplate 会更快吗?我还是 ExtJS 的新手,所以如果您知道/使用过,请分享最佳实践。

最佳答案

最好的方法是不要这样做。创建数以千计的控件将需要大量内存,无论您如何操作。正如您所注意到的,这会使应用程序极其缓慢。

解决方案是将元素保留在服务器上并使用某种形式的分页来仅创建用户实际可以看到的元素。

分页可以是显式的(“加载接下来的 10 行”),也可以是隐式的,当滚动条到达右/底端并加载更多行时触发事件。

通常,您甚至可以对用户隐藏它。始终加载整行(隐藏同一行中由于浏览器窗口太窄而不可见的元素通常无济于事)。

在服务器上,你会知道你有多少行。加载前 20 行并显示它们。找到行的高度(理想情况下,它们应该都是相同的高度)并在 20 行下方创建一个空 DIV,以展开 ScrollView 。这使得它看起来好像所有的行都在那里(用户看到正确的滚动条,滚动条不会在滚动时跳转)。

一旦那个空的 div 出现,加载更多行并缩小它。

关于extjs4 - 使用 ExtJS 生成大约一千个或更多的控件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11448035/

相关文章:

javascript - 验证 ExtJS CheckboxGroup 复选框

javascript - ExtJs 4 ViewPort 与带有边框布局的面板 - 使用哪个以及为什么?

extjs4 - 如何使用 ExtJS 4.1 增加 VBOX 中项目之间的间距?

extjs4 捕获面板上的滚动事件

javascript - 添加记录到 Ext.data.ArrayStore

javascript - Sencha Ext Js 如何将对象添加到 Ext.grid.Panel

javascript - 如何创建仅屏蔽 ExtJs 4 中特定组件的模态窗口?

css - 如何在 extjs4.0 应用程序中创建 css 背景效果(选择)

css - 在 extjs 中显示图像而不是复选框的选中状态

javascript - Ext-JS 4 动态创建 Controller - 代码不起作用