Wie Profil (Debug) ExtJS EventPipe/Ereignisse

Question

Ich arbeite an einer relativ großen ExtJS MVC-Anwendung mit rund> 40 Controller,> 100 Stores,> 100 Modelle und so weiter. Ich folge der möglichen MVC-Methode nicht strikt, also habe ich eine Lazy-Controller-Initialisierung implementiert, die den Controller zuerst initialisiert, wenn es benötigt wird und so die Speicher. Ich registriere auch keine Ansicht innerhalb eines Controllers, aber das muss ich einfach nicht tun.

Jetzt kommt es, dass Formulare (geöffnet in einem Ext.window.Window) etwa 1-2 Sekunden dauern, bis sie angezeigt werden, während die gleiche Form in einem eher kleinen Projekt sofort auftaucht. Also die Form (Layout) kann hier nicht das Problem sein, was mich zu den Ereignissen gebracht hat. Aber ich weiß nicht wirklich, wie das am besten wäre oder gibt es schon ein gutes Tutorial, wie man das macht. Ich denke, es wäre schön, dies zu profilieren, um zu sehen, wie lange die gesamte Pipe dauert (nicht nur die EventPipe selbst).

Ereignisstruktur:

Die meisten Veranstaltungen erhalten über control() der verantwortlichen Controller registriert. Alle anderen Ereignisse sind höchstens mit { single: true } registriert. Die Fenster werden geschlossen und bei erneuter Verwendung wiederhergestellt.

Answer 1

Ich habe Angst, aber ExtJS bietet keine Event Profiling. Es verwendet ein benutzerdefiniertes Ereignissystem.

Hier ist, wie ich die Lösung dieses Problems sehe.

Es gibt Ext.util.Event-Klasse, die im Rahmen und Ext.app.EventBus verwendet Funktionalität Dispatching und Umgang mit jeder Veranstaltung bietet die Single Point bieten alle Rahmenveranstaltungen versenden (fireevent ist nur für Ext.app.EventBus.dispatch Methode Wrapper).

Klassen sind privat, daher empfehle ich, den Quellcode zu sehen.

können Sie diese Klassen außer Kraft setzen, um zu sehen, wie viel es Ext.app.EventBus.dispatch Methode von Aufruf und ruft Ereignis-Listener innerhalb Ext.util.Event.fire Methode smth wie das (EventProfiler soll nimmt Ihr sein eigene Klasse)

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); 
    } 

    /* ... */  

}