Как профиль (отладка) ExtJS EventPipe/Events

Я работаю над относительно большим программным обеспечением ExtJS MVC со скоростью > 40 контроллеров, > 100 магазинов, > 100 моделей и т.д. Я не слежу за возможным способом MVC, поэтому я реализовал ленивую инициализацию контроллера, которая сначала инициализирует контроллер, когда это требуется, и поэтому магазины. Я также не регистрирую никакого представления в любом контроллере, но это просто потому, что мне не нужно.

Теперь приходят, что формы (открытые внутри Ext.window.Window) занимают 1-2 секунды, пока они не появятся, пока одна и та же форма внутри небольшого проекта появится сразу. Таким образом, форма (макет) не может быть проблемой здесь, что привело меня к событиям. Но я не знаю, как это будет лучшим способом или есть хороший учебник, как это сделать. Я думаю, было бы неплохо продумать это, чтобы увидеть, сколько времени занимает весь трубопровод (не только сам EventPipe).

Структура событий:

Большинство событий регистрируются через control() ответственного контроллера. Все остальные события в большинстве случаев регистрируются с помощью { single: true }. Окна закрываются и восстанавливаются при повторном использовании.

Ответы

Ответ 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 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);
    }

    /* ... */       

}