如何配置(调试)ExtJS EventPipe/Events

Question

我正在开发一个相对较大的ExtJS MVC应用程序,大约有40个控制器,> 100个商店,> 100个模型等等.我没有遵循可能的MVC方式严格,所以我实现了一个懒惰的控制器初始化,它首先在需要时初始化控制器,因此存储.我也没有在任何控制器中注册任何视图,但这只是因为我不需要.

现在,表单(在Ext.window.Window中打开)大约需要1-2秒,直到它们出现,同时在一个相当小的项目中立即弹出相同的表单.所以形式(布局)不能成为我带来事件的问题.但我真的不知道最好的方法是什么,或者已经有一个很好的教程如何做到这一点.我想最好对它进行分析,看看整个管道需要多长时间(不仅仅是EventPipe本身).

活动结构:

大多数事件都是通过control()负责的控制器注册的.所有其他活动最多注册{ single: true }.窗口在重用时关闭并重新实例化.

Answer 1

我很害怕,但ExtJS不提供任何事件分析.它使用自定义事件系统.

以下是我如何看待此问题的解决方案.

有Ext.util.Event提供功能调度和处理的框架和使用的任何事件类Ext.app.EventBus提供单点调度所有框架事件(fireEvent仅仅是Ext.app.EventBus.dispatch方法包装).

类是私有的,所以我建议看它的源代码.

您可以覆盖这些类,以查看调用Ext.app.EventBus.dispatch方法并在Ext.util.Event.fire方法中调用事件侦听器需要花费多少(EventProfiler应该是您自己的类)

Ext.app.EventBus

dispatch: function (/* event name or Ext.util.Event */event, /* Target class */ target, args) {
    //start timing
    var start = new Date();

    /* ... */

    for (i = 0, ln = events.length; i < ln; i++) {
        event = events[i];
        // Fire the event!
        if (event.fire.apply(event, Array.prototype.slice.call(args, 1)) === false) {
            return false;
        }
        // start event profiling
        // here we are sure that event is dispatched and it's instance of Ext.util.Event
        EventProfiler.startProfile(event, /* time passed from dispath method started */new Date() - start);
    }

    /* rest of dispatch method call */
}

Ext.util.Event

fire: function () {
    /* ... */
    if (listener.o) {
        args.push(listener.o);
    }

    EventProfiler.endProfile(this);

    if (listener && listener.fireFn.apply(listener.scope || me.observable, args) === false) {
        return (me.firing = false);
    }

    /* ... */       

}