Net Panel Architecture Review

From FirebugWiki

(Difference between revisions)
Jump to: navigation, search
(Modules)
m (nsIActivityDistributor -> nsIHttpActivityDistributor)
 
(2 intermediate revisions not shown)
Line 1: Line 1:
-
 
[[File:Net-panel-architecture.png]]
[[File:Net-panel-architecture.png]]
== Description ==
== Description ==
-
* '''HTTP Activity Observer''' Used to observer detailed HTTP traffic. Provides precise timing information about executed HTTP requests and post information to ''Net Progress'' context object.
+
* '''HTTP Activity Observer''' Used to observer detailed HTTP traffic. Based on the [https://developer.mozilla.org/en/XPCOM_Interface_Reference/nsIHttpActivityDistributor nsIHttpActivityDistributor] and utilizes the [https://developer.mozilla.org/en/XPCOM_Interface_Reference/nsIHttpActivityObserver nsIHttpActivityObserver]. Provides precise timing information about executed HTTP requests and post information to ''Net Progress'' context object.
-
* '''HTTP Observer''' Used to observer HTTP following events <code>http-on-modify-request</code>, <code>http-on-examine-response</code> and <code>http-on-examine-cached-response</code>. Use mainly for catching also events coming from BFCache that are not observed by ''HTTP Activity Observer''. Also posts information to ''Net Progress'' object.
+
* '''HTTP Observer''' Used to observe the HTTP following events <code>http-on-modify-request</code>, <code>http-on-examine-response</code> and <code>http-on-examine-cached-response</code> (see [https://developer.mozilla.org/en/Observer_Notifications#HTTP_requests Observer HTTP request notifications]). Based on the [https://developer.mozilla.org/en/NsIObserver nsIObserver] and the related [https://developer.mozilla.org/en/XPCOM_Interface_Reference/nsIObserverService nsIObserverService]. Mainly used for catching also events coming from [http://www.softwareishard.com/blog/firebug/firebug-16-tracking-also-bfcache-reads/ BFCache], that are not observed by the ''HTTP Activity Observer''. Also posts information to the ''Net Progress'' object.
-
* '''Net Progress''' Context object responsible for collecting and processing all HTTP traffic information related to specific page/tab. All network events are stored in an ''Input Queue'' in case the Net panel (UI) is not selected (enabled but not selected) and so, it isn't necessary to do any rendering (need to be fixed in Firebug). This strategy safes CPU cycles since the entire processing is done as soon as the panel is actually selected by the user. In case when the Net panel (or any other UI) is selected all incoming events are processed and gathered information collected in set of objects that represent individual requests. These objects are consequently put into the ''Output Queue''. Note that there can be many network events related to one request (e.g.: ''connecting, sending, waiting, receiving, receiving, etc.''. Part of the processing task is to collect these events and put all information into the corresponding request related object.
+
* '''Net Progress''' Context object responsible for collecting and processing all HTTP traffic information related to a specific tab/page. All network events are stored in an ''Input Queue'' in case the [[Net Panel]] (UI) is not selected (enabled, but not selected) and so, it isn't necessary to do any rendering (needs to be fixed in Firebug). This strategy safes CPU cycles, since the entire processing is done as soon as the panel is actually selected by the user. In case when the Net panel (or any other UI) is selected, all incoming events are processed and information gathered in a set of objects, that represent individual requests. These objects are consequently put into the ''Output Queue''. Note, that there can be many network events related to one request (e.g.: ''connecting'', ''sending'', ''waiting'', ''receiving'', ''blocking'', etc.). Part of the processing task is to collect these events and put all information into the corresponding request related object.
-
* '''Context''' This object is used by Firebug to collect all meta-data about specific page. ''Net Progress'' object is part of it (shares the same life-cycle).
+
* '''Context''' This object is used by Firebug to collect all meta-data about a specific page. The ''Net Progress'' object is part of it (shares the same life-cycle).
-
* '''Net Panel''' This object is responsible for reading ''Output Queue'' from the ''Net Progress'' object and generate UI. This is done upon a fixed timeout (300ms) so, heavy traffic doesn't generate to many unnecessary UI layout changes. The output queue consist from object that represents individual HTTP requests an so, presence of an object in the queue ensures update of the corresponding entry existing or just generated in the panel. Part of the update process is also generation of a ''Waterfall graph'' (aka Timeline).
+
* '''Net Panel''' This object is responsible for reading the ''Output Queue'' from the ''Net Progress'' object and generate the UI. This is done upon a fixed timeout (300ms) so, heavy traffic doesn't generate to many unnecessary UI layout changes. The output queue consists of an object, that represents individual HTTP requests an so, presence of an object in the queue ensures updating of the corresponding entry existing or just generated in the panel. Part of the update process is also the generation of a ''waterfall graph'' (aka [[Net Panel#Timeline|Timeline]]).
* '''UI Templates''' Set of Domplate based templates used by the Net panel to generate the entire panel UI (HTML/CSS).
* '''UI Templates''' Set of Domplate based templates used by the Net panel to generate the entire panel UI (HTML/CSS).
-
* '''Net Monitor''' Represents a module that is associated with ''Net Panel''. There is one instance of this object per browser window. Note that there is one instance of ''Net Panel'' per page/tab. This object manage attaching/detaching of HTTP observers. Observers are attached only if there is at least one ''Net Panel'' that wants to actually display HTTP network traffic.
+
* '''Net Monitor''' Represents a module, that is associated with the ''Net Panel''. There is one instance of this object per browser window. Note, that there is one instance of a ''Net Panel'' per page/tab. This object manages attaching/detaching of HTTP observers. Observers are only attached, if there is at least one ''Net Panel'', that actually wants to display HTTP network traffic.
* ''Client/Server'' Experimental separation of the diagram as preparation for Firebug remoting. It needs to be prototyped yet (the ''Net Progress'' should be partially cached on the server side and flushed on timeout in order to safe the HTTP traffic overhead).
* ''Client/Server'' Experimental separation of the diagram as preparation for Firebug remoting. It needs to be prototyped yet (the ''Net Progress'' should be partially cached on the server side and flushed on timeout in order to safe the HTTP traffic overhead).
Line 22: Line 21:
== Modules ==
== Modules ==
-
* '''firebug/net/httpActivityObserver''' HTTP Activity Observer (based on <code>nsIActivityDistributor</code>)
+
* '''firebug/net/httpActivityObserver.js''' HTTP Activity Observer (based on [https://developer.mozilla.org/en/XPCOM_Interface_Reference/nsIHttpActivityDistributor nsIHttpActivityDistributor])
-
* '''firebug/net/requestObserver''' Generic HTTP Observer (based on <code>nsIObserver</code>)
+
* '''firebug/net/requestObserver.js''' Generic HTTP Observer (based on [https://developer.mozilla.org/en/NsIObserver nsIObserver])
-
* '''firebug/net/netProgress''' Net Progress
+
* '''firebug/net/responseObserver.js''' HTTP response body tracking (based on [https://developer.mozilla.org/en/XPCOM_Interface_Reference/NsITraceableChannel nsITraceableChannel])
-
* '''firebug/net/netPanel''' Net Panel
+
* '''firebug/net/netProgress.js''' Net Progress
-
* '''firebug/net/netReps''' UI Templates
+
* '''firebug/net/netPanel.js''' Net Panel
-
* '''firebug/net/netMonitor''' Net Monitor
+
* '''firebug/net/netReps.js''' UI templates
-
* '''firebug/net/httpLib''' HTTP related API shared across modules.
+
* '''firebug/net/netMonitor.js''' Network Monitor
-
* '''firebug/net/netUtils''' Utility functions (should be part of ''firebug/net/httpLib''
+
* '''firebug/net/httpLib.js''' HTTP related API shared across modules.
-
* '''firebug/net/responseObserver''' HTTP response body tracking (based on <code>nsITraceableChannel</code>)
+
* '''firebug/net/netUtils.js''' Utility functions (should be part of ''firebug/net/httpLib''
-
* '''firebug/net/netDebugger''' Support for XHR breakpoints.
+
* '''firebug/net/netDebugger.js''' Support for XHR breakpoints.
 +
 
 +
== Resources ==
 +
* [[Net Panel Remoting]]
 +
* [https://developer.mozilla.org/en/Monitoring_HTTP_activity Monitoring HTTP activity]

Latest revision as of 08:42, 2 November 2011

Net-panel-architecture.png

[edit] Description

  • HTTP Activity Observer Used to observer detailed HTTP traffic. Based on the nsIHttpActivityDistributor and utilizes the nsIHttpActivityObserver. Provides precise timing information about executed HTTP requests and post information to Net Progress context object.
  • HTTP Observer Used to observe the HTTP following events http-on-modify-request, http-on-examine-response and http-on-examine-cached-response (see Observer HTTP request notifications). Based on the nsIObserver and the related nsIObserverService. Mainly used for catching also events coming from BFCache, that are not observed by the HTTP Activity Observer. Also posts information to the Net Progress object.
  • Net Progress Context object responsible for collecting and processing all HTTP traffic information related to a specific tab/page. All network events are stored in an Input Queue in case the Net Panel (UI) is not selected (enabled, but not selected) and so, it isn't necessary to do any rendering (needs to be fixed in Firebug). This strategy safes CPU cycles, since the entire processing is done as soon as the panel is actually selected by the user. In case when the Net panel (or any other UI) is selected, all incoming events are processed and information gathered in a set of objects, that represent individual requests. These objects are consequently put into the Output Queue. Note, that there can be many network events related to one request (e.g.: connecting, sending, waiting, receiving, blocking, etc.). Part of the processing task is to collect these events and put all information into the corresponding request related object.
  • Context This object is used by Firebug to collect all meta-data about a specific page. The Net Progress object is part of it (shares the same life-cycle).
  • Net Panel This object is responsible for reading the Output Queue from the Net Progress object and generate the UI. This is done upon a fixed timeout (300ms) so, heavy traffic doesn't generate to many unnecessary UI layout changes. The output queue consists of an object, that represents individual HTTP requests an so, presence of an object in the queue ensures updating of the corresponding entry existing or just generated in the panel. Part of the update process is also the generation of a waterfall graph (aka Timeline).
  • UI Templates Set of Domplate based templates used by the Net panel to generate the entire panel UI (HTML/CSS).
  • Net Monitor Represents a module, that is associated with the Net Panel. There is one instance of this object per browser window. Note, that there is one instance of a Net Panel per page/tab. This object manages attaching/detaching of HTTP observers. Observers are only attached, if there is at least one Net Panel, that actually wants to display HTTP network traffic.
  • Client/Server Experimental separation of the diagram as preparation for Firebug remoting. It needs to be prototyped yet (the Net Progress should be partially cached on the server side and flushed on timeout in order to safe the HTTP traffic overhead).

[edit] Modules

  • firebug/net/httpActivityObserver.js HTTP Activity Observer (based on nsIHttpActivityDistributor)
  • firebug/net/requestObserver.js Generic HTTP Observer (based on nsIObserver)
  • firebug/net/responseObserver.js HTTP response body tracking (based on nsITraceableChannel)
  • firebug/net/netProgress.js Net Progress
  • firebug/net/netPanel.js Net Panel
  • firebug/net/netReps.js UI templates
  • firebug/net/netMonitor.js Network Monitor
  • firebug/net/httpLib.js HTTP related API shared across modules.
  • firebug/net/netUtils.js Utility functions (should be part of firebug/net/httpLib
  • firebug/net/netDebugger.js Support for XHR breakpoints.

[edit] Resources

Personal tools