--- a/browser/devtools/netmonitor/netmonitor-controller.js
+++ b/browser/devtools/netmonitor/netmonitor-controller.js
@@ -435,17 +435,16 @@ let NetMonitorController = {
  */
 function TargetEventsHandler() {
   this._onTabNavigated = this._onTabNavigated.bind(this);
   this._onTabDetached = this._onTabDetached.bind(this);
 }
 
 TargetEventsHandler.prototype = {
   get target() NetMonitorController._target,
-  get webConsoleClient() NetMonitorController.webConsoleClient,
 
   /**
    * Listen for events emitted by the current tab target.
    */
   connect: function() {
     dumpn("TargetEventsHandler is connecting...");
     this.target.on("close", this._onTabDetached);
     this.target.on("navigate", this._onTabNavigated);

--- a/browser/devtools/webconsole/webconsole.js
+++ b/browser/devtools/webconsole/webconsole.js
@@ -1208,16 +1208,19 @@ WebConsoleFrame.prototype = {
         }
         case "LogMessage":
           this.handleLogMessage(aMessage);
           break;
         case "ConsoleAPI":
           this.outputMessage(CATEGORY_WEBDEV, this.logConsoleAPIMessage,
                              [aMessage]);
           break;
+        case "NetworkEvent":
+          this.outputMessage(CATEGORY_NETWORK, this.logNetEvent, [aMessage]);
+          break;
       }
     }, this);
   },
 
   /**
    * Logs a message to the Web Console that originates from the Web Console
    * server.
    *
@@ -1541,17 +1544,18 @@ WebConsoleFrame.prototype = {
     }
 
     let methodNode = this.document.createElementNS(XHTML_NS, "span");
     methodNode.className = "method";
     methodNode.textContent = request.method + " ";
 
     let messageNode = this.createMessageNode(CATEGORY_NETWORK, severity,
                                              methodNode, null, null,
-                                             clipboardText);
+                                             clipboardText, null,
+                                             networkInfo.timeStamp);
     if (networkInfo.private) {
       messageNode.setAttribute("private", true);
     }
     messageNode._connectionId = actorId;
     messageNode.url = request.url;
 
     let body = methodNode.parentNode;
     body.setAttribute("aria-haspopup", true);
@@ -5135,17 +5139,20 @@ WebConsoleConnectionProxy.prototype = {
     }
 
     if (!this._connectTimer) {
       // This happens if the promise is rejected (eg. a timeout), but the
       // connection attempt is successful, nonetheless.
       Cu.reportError("Web Console getCachedMessages error: invalid state.");
     }
 
-    this.owner.displayCachedMessages(aResponse.messages);
+    let messages = aResponse.messages.concat(...this.webConsoleClient.getNetworkEvents());
+    messages.sort((a, b) => a.timeStamp - b.timeStamp);
+
+    this.owner.displayCachedMessages(messages);
 
     if (!this._hasNativeConsoleAPI) {
       this.owner.logWarningAboutReplacedAPI();
     }
 
     this.connected = true;
     this._connectDefer.resolve(this);
   },

--- a/toolkit/devtools/server/actors/webconsole.js
+++ b/toolkit/devtools/server/actors/webconsole.js
@@ -729,18 +729,16 @@ WebConsoleActor.prototype =
             }
             messages.push(message);
           });
           break;
         }
       }
     }
 
-    messages.sort(function(a, b) { return a.timeStamp - b.timeStamp; });
-
     return {
       from: this.actorID,
       messages: messages,
     };
   },
 
   /**
    * Handler for the "evaluateJSAsync" request. This method evaluates the given
@@ -1601,16 +1599,17 @@ NetworkEventActor.prototype =
   /**
    * Returns a grip for this actor for returning in a protocol message.
    */
   grip: function NEA_grip()
   {
     return {
       actor: this.actorID,
       startedDateTime: this._startedDateTime,
+      timeStamp: Date.parse(this._startedDateTime),
       url: this._request.url,
       method: this._request.method,
       isXHR: this._isXHR,
       fromCache: this._fromCache,
       private: this._private,
     };
   },
 

--- a/toolkit/devtools/webconsole/client.js
+++ b/toolkit/devtools/webconsole/client.js
@@ -63,16 +63,20 @@ WebConsoleClient.prototype = {
   hasNetworkRequest(actorId) {
     return this._networkRequests.has(actorId);
   },
 
   removeNetworkRequest(actorId) {
     this._networkRequests.delete(actorId);
   },
 
+  getNetworkEvents() {
+    return this._networkRequests.values();
+  },
+
   get actor() { return this._actor; },
 
   /**
    * The "networkEvent" message type handler. We redirect any message to
    * the UI for displaying.
    *
    * @private
    * @param string type
@@ -80,16 +84,18 @@ WebConsoleClient.prototype = {
    * @param object packet
    *        The message received from the server.
    */
   _onNetworkEvent: function (type, packet)
   {
     if (packet.from == this._actor) {
       let actor = packet.eventActor;
       let networkInfo = {
+        _type: "NetworkEvent",
+        timeStamp: actor.timeStamp,
         node: null,
         actor: actor.actor,
         discardRequestBody: true,
         discardResponseBody: true,
         startedDateTime: actor.startedDateTime,
         request: {
           url: actor.url,
           method: actor.method,

--- a/toolkit/devtools/webconsole/utils.js
+++ b/toolkit/devtools/webconsole/utils.js
@@ -1491,23 +1491,16 @@ ConsoleAPIListener.prototype =
     CONSOLE_WORKER_IDS.forEach((id) => {
       messages = messages.concat(ConsoleAPIStorage.getEvents(id));
     });
 
     if (this.consoleID) {
       messages = messages.filter((m) => m.consoleID == this.consoleID);
     }
 
-    // ConsoleAPIStorage gives up messages sorted, but we ask for different
-    // blocks of events and we must sort them again in order to show them in the
-    // proper order.
-    messages = messages.sort(function(a, b) {
-      return a.timeStamp - b.timeStamp;
-    });
-
     if (aIncludePrivate) {
       return messages;
     }
 
     return messages.filter((m) => !m.private);
   },
 
   /**