如何在ExtJS 4.1.3的MVC架构中实现JS文件的按需加载？

Question

在企业应用程序中，我们的应用程序中可能包含大量的JS文件。要在第一个位置加载如此庞大的文件，将需要更多的时间，这与我们的应用程序的初始加载时间成正比。

他们是否有任何加载JS文件On Demand的机制，即他们需要什么时候？

有人能告诉我如何在ExtJS中充分利用Ext.require（[]）吗？

Answer 1

要求您在每个文件中使用的所有类。当您想要创建应用程序的生产版本时，这也非常重要。请参阅本指南中的缩小过程：

http://docs.sencha.com/extjs/4.2.2/#!/guide/getting_started

“ Ext JS 4附带了一个系统，用于动态加载运行应用程序所需的JavaScript资源。在我们的示例中，Ext.create创建一个Ext.container.Viewport实例。当Ext。时。 create被称为加载器将首先检查是否已定义Ext.container.Viewport。如果未定义，加载器将尝试在实例化视口对象之前加载包含Ext.container.Viewport代码的JavaScript文件。我们的示例Viewport.js文件成功加载，但加载器检测到文件的加载方式不是最佳。因为我们只在请求Ext.container.Viewport的实例时才加载Viewport.js文件，代码的执行一直停止，直到该文件成功加载，导致短暂的延迟。如果我们多次调用Ext.create，这个延迟会更加复杂，因为应用程序会在请求下一个文件之前等待加载每个文件。

要解决这个问题，我们可以在Ext.application的调用之上添加这一行代码：

Ext.require('Ext.container.Viewport');“

这将确保在应用程序运行之前加载包含Ext.container.Viewport代码的文件。刷新页面时，您不应再看到Ext.Loader警告。

Answer 2

但通过这样做，您的应用程序性能实际上会受到影响。 ExtJs框架包含几百个文件并单独加载它们会花费更多时间然后加载包含所有应用程序的1-2个缩小文件。

您是否构建了（即连接和缩小）您的申请？