Ext JS 4.2.1加载控制器 - 最佳实践

时间:2013-06-24 16:20:27

标签: javascript extjs extjs4.2 dynamic-loading deftjs

我目前正在开发一个包含许多视图/控制器的Ext JS应用程序/ ... 我想知道自己加载JS控制器/视图等等的最佳实践是什么......

目前我的应用程序定义如下:

// enable javascript cache for debugging, otherwise Chrome breakpoints are lost
Ext.Loader.setConfig({ disableCaching: false });

Ext.require('Ext.util.History');
Ext.require('app.Sitemap');
Ext.require('app.Error');


Ext.define('app.Application', {
    name: 'app',

    extend: 'Ext.app.Application',

    views: [
        // TODO: add views here
        'app.view.Viewport',
        'app.view.BaseMain',
        'app.view.Main',
        'app.view.ApplicationHeader',

        //administration
        'app.view.administration.User'
         ...
    ],

    controllers: [
        'app.controller.Viewport',
        'app.controller.Main',
        'app.controller.ApplicationHeader',

        //administration
        'app.controller.administration.User',
        ...
    ],

    stores: [
        // stores in there..
    ]
});

不知何故,这会强制客户端在启动时加载我的所有视图和控制器,当然正在调用所有控制器的所有init方法。 每次我查看我的视图时都需要加载数据..现在我无法在我的控制器初始化函数中加载它。我必须做这样的事情我假设:

init: function () {
    this.control({
        '#administration_User': {
            afterrender: this.onAfterRender
        }
    });
},

有更好的方法吗?或者只是另一个事件?

虽然我质疑自己的主要问题是在启动时加载所有javascript是否是最佳做法。仅仅加载客户端现在需要的控制器/视图/ ...是不是更好?或者我应该在启动时加载所有JS?

如果我想动态加载控制器,我该怎么做?我假设一个必须从我的应用程序数组(视图,控制器,存储)中删除它们并创建一个实例,如果我确实需要它并且mby在控制器init中设置视图?!

什么是最佳做法?

更新

使用viewcontroller的deftJS是一个不错的选择吗? deftJS的主要优点和缺点是什么?

1 个答案:

答案 0 :(得分:3)

您可以在启动时加载所有控制器。请参见下面的链接,测试了1000个控制器并且速度很快:

Best practices for initializing and deconstructing controllers

快速应用程序的最佳选择是使用sencha cmd将所有必需文件最小化并压缩到一个文件中。

您不应该将数据加载到init中的视图中,因为ui尚未加载,如果您愿意,可以在onLoad上执行此操作。

我会在afterrenderactivated个事件中加载视图的数据。

理想情况下,您将使用模块化方法,在模块上调用init()方法,该模块需要该模块的控制器,视图和模型。