Extjs 3 到 Extjs 4 [关闭]

Posted

技术标签:

【中文标题】Extjs 3 到 Extjs 4 [关闭]【英文标题】:Extjs 3 to Extjs 4 [closed] 【发布时间】:2011-07-11 11:10:46 【问题描述】:

我想从 extjs 3 迁移到 extjs 4。我在 rails 3 中测试了sample Extjs 4 示例。我观察到 extjs 4 中的页面渲染时间非常慢。我不知道是什么原因. 谁能告诉我,这背后的原因是什么?或 我的应用程序有什么问题吗?和 我应该怎么做才能提高 extjs 4 的性能?

【问题讨论】:

你观察到是 ajax 问题(网络)还是 ext 渲染问题? 感谢回复,不过我已经在本地主机上测试过了。我认为这不是任何ajax问题。并且也有与 ext 3 相同的应用程序。我不使用任何网格。我只是展示一个简单的形式,仍然很慢。我不知道为什么会这样。 我正在使用 grails1.4M1+extjs4.0.2,但看不出它很慢。也许你必须提供更多信息 @atian25。所以我的rails应用程序可能是原因。但我的应用程序在 extjs3 中表现良好。 你能做的最好的事情是创建一个简单的简化来显示问题,然后人们可以分析它。当你只是说“我的 Ext-4 应用程序很慢”时,这很难提供帮助 【参考方案1】:

ExtJS 4.0 存在性能问题,

ExtJS 4.0.2 是修复大多数性能问题所需的版本,但它仍然很慢...

Google 的 ExtJS 4 性能

【讨论】:

反对将 ExtJS 与 jQuery 进行比较。 @dmackerman,我比较的是质量和性能,而不是那些框架的特性。你用过 ExtJS、Dojo 和 jQuery 吗? @Dzhu:Ext-JS 和 jQuery 是完全不同的野兽,不要拿橙子和苹果比较。 jQuery 就像 Ext-Core sencha.com/products/extcore,尝试测量这两者的性能。 Ext-JS 更像 jQueryUI(但 jQueryUI 没有那么好)。 Dojo 是一个更好的比较。 jQuery 用于渐进式增强,Ext-JS 用于需要 JS 的 Web 应用程序。我正在使用 Ext-JS 4.0.6,虽然我确实认为 Ext-JS 4.0 没有经过彻底测试(我自己发现了太多错误),但我仍然认为它是网络上最完整的 UI 框架/库。 @JuanMendes 我在许多商业项目(Ajax JEE 应用程序)中广泛使用了 dojo 和 extjs。 ExtJS 在如何使用它做事方面非常严格。 ExtJS 最糟糕的事情之一是它布局组件的方式——如果你不给组件明确的宽度/高度声明,这有时会导致“递归过多”异常。其次,一切都需要在javascript中定义,这使得代码很难阅读,使用dojo,您可以在模板文件中extern html。 ExtJS 是“最完整”的框架?我非常怀疑,你只能称它为框架 @Dzhu:学习它有一个陡峭的曲线。但是作为高级用户,Ext 的组件架构允许我编写干净的 OO UI,它是可测试的、可重用的和解耦的。您的布局问题似乎来自对布局管道的误解。在由布局管理器处理的 Ext-JS 应用程序中,您只需指定您希望它们的布局方式。混合 CSS 布局和某些 Ext-JS 小部件需要您设置它们的宽度,从未见过高度问题。【参考方案2】:

您是否忘记关闭动态资源加载?请注意,ext*-all.js 将大大加快您的页面加载速度。

【讨论】:

【参考方案3】:

ExtJS 4 比 ExtJS 3 快得多。来自 sencha 的家伙解决了很多渲染问题并大大提高了性能。

在示例链接中,只需阅读部署部分。由于在第 4 版中引入了 ext loader,开发性能存在正常问题,使用框架的具体短文件而不是加载大文件(超过 100k 行)进行调试和开发要好得多,而且您始终知道问题出在哪里是。

在生产中,您需要使用 Sencha SDK,它将生成您的应用程序初始所需的 js 和 extjs 依赖项。它比需要加载所有框架的第 3 版要好得多。

【讨论】:

【参考方案4】:

您可以运行 Sencha CMD,这是一个动态创建 ExtJS 4 css 文件的 ruby​​ gem,允许您将完整的 css 文件(约 500kb !)缩减为不那么荒谬的东西。

我在 4 月份在这里https://docs.google.com/document/d/1lGfbEoktJNhIpZneeJ2kkjNKOaSYpOse3mnSA5mGEds/edit?usp=sharing 概述了这个过程

【讨论】:

【参考方案5】:

Extjs 4.1 解决了许多与布局相关的问题。如果您有嵌套面板,则与 Ext 3 相比,渲染效果更好。

【讨论】:

您所说的“更好的渲染”是指速度/性能,这就是 OP 所要求的? 性能。尤其是在边框布局的性能方面存在巨大差异。【参考方案6】:
    似乎回复晚了,但事实是 ExtJS 4.x 比 ExtJS 3.x 版本快得多,更重要的是它使前端开发人员使用 MVC 模式的方法创建他们的应用程序来组织他们的编码结构更清晰可维护。 ExtJS 4.x 解决了渲染问题,同时提高了浏览器兼容性的性能。 要回答您的问题,可能有很多原因,如下所述。
      使用开发工具检查,与 extjs 3.x 相比,js 文件的哪个部分需要更多时间来加载 您可能正在使用更多内部组件(向具有更多子组件的父组件和子组件添加更多项目等)。 即使您可以使用新推出的 Sencha SDK 工具(在此处下载),也可以比以往更轻松地部署任何 Ext JS 4 应用程序。这些工具允许您以 JSB3(JSBuilder 文件格式)文件的形式生成所有 JavaScript 依赖项的清单,并创建仅包含应用程序所需代码的自定义构建。

注意:这完全取决于您如何设计应用程序(架构师)。

谢谢

【讨论】:

【参考方案7】:

与 ExtJS 3.x 相比,ExtJS 4.x 包含很多错误。我在我的不同项目中同时使用两者。例如 4.0.7 包含文件上传问题,所以我想告诉我我的意见 extjs 3.x 是更稳定的 extjs 框架版本。

【讨论】:

【参考方案8】:

使用Extjs4.0或更高版本的MVC特性 将商店视图模型控制器放在不同的文件夹中 并使用控制器调用它们。

【讨论】:

以上是关于Extjs 3 到 Extjs 4 [关闭]的主要内容,如果未能解决你的问题,请参考以下文章

Extjs 4.2 关闭浏览器不弹出提示窗口

在 ExtJS 4.1 中单击外部窗口时如何关闭窗口?

如何在 extjs4.1 中使用 rest webservice [关闭]

ExtJs - 具有动态可关闭标签的文本字段

Extjs 窗口关闭事件

ExtJS4 窗口在 IE 中不关闭