Bug 1381648 - Add non blocking time to the statistics panel of netmonitor; r=Honza
authorVincent Lequertier <vi.le@autistici.org>
Fri, 06 Oct 2017 15:11:18 +0200
changeset 444224 bad9f2a1be214b9bc5277fe766fe0d5a7d146ad4
parent 444223 c908b2bffe6e8991ede42e196358e7db3041a9be
child 444225 9aff6ae3fc566b7cb599b63b53350069801d83b5
push id1618
push userCallek@gmail.com
push dateThu, 11 Jan 2018 17:45:48 +0000
treeherdermozilla-release@882ca853e05a [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersHonza
bugs1381648
milestone58.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1381648 - Add non blocking time to the statistics panel of netmonitor; r=Honza MozReview-Commit-ID: Anw4hTlpPjH
devtools/client/locales/en-US/netmonitor.properties
devtools/client/netmonitor/src/components/StatisticsPanel.js
--- a/devtools/client/locales/en-US/netmonitor.properties
+++ b/devtools/client/locales/en-US/netmonitor.properties
@@ -316,17 +316,23 @@ charts.cacheDisabled=Empty cache
 # LOCALIZATION NOTE (charts.totalSize): This is the label displayed
 # in the performance analysis view for total requests size, in kilobytes.
 charts.totalSize=Size: %S KB
 
 # LOCALIZATION NOTE (charts.totalSeconds): Semi-colon list of plural forms.
 # See: http://developer.mozilla.org/en/docs/Localization_and_Plurals
 # This is the label displayed in the performance analysis view for the
 # total requests time, in seconds.
-charts.totalSeconds=Time: #1 second;Time: #1 seconds
+charts.totalSeconds=Time: %1$S second;Time: %1$S seconds
+
+# LOCALIZATION NOTE (charts.totalSecondsNonBlocking): Semi-colon list of plural forms.
+# See: http://developer.mozilla.org/en/docs/Localization_and_Plurals
+# This is the label displayed in the performance analysis view for the
+# total requests time (non-blocking), in seconds.
+charts.totalSecondsNonBlocking=Non blocking time: %1$S second;Non blocking time: %1$S seconds
 
 # LOCALIZATION NOTE (charts.totalCached): This is the label displayed
 # in the performance analysis view for total cached responses.
 charts.totalCached=Cached responses: %S
 
 # LOCALIZATION NOTE (charts.totalCount): This is the label displayed
 # in the performance analysis view for total requests.
 charts.totalCount=Total requests: %S
@@ -343,16 +349,21 @@ charts.type=Type
 # in the header column in the performance analysis view for transferred
 # size of the request.
 charts.transferred=Transferred
 
 # LOCALIZATION NOTE (charts.totalCount): This is the label displayed
 # in the header column in the performance analysis view for time of request.
 charts.time=Time
 
+# LOCALIZATION NOTE (charts.nonBlockingTime): This is the label displayed
+# in the header column in the performance analysis view for non blocking
+# time of request.
+charts.nonBlockingTime=Non blocking time
+
 # LOCALIZATION NOTE (netRequest.headers): A label used for Headers tab
 # This tab displays list of HTTP headers
 netRequest.headers=Headers
 
 # LOCALIZATION NOTE (netRequest.response): A label used for Response tab
 # This tab displays HTTP response body
 netRequest.response=Response
 
--- a/devtools/client/netmonitor/src/components/StatisticsPanel.js
+++ b/devtools/client/netmonitor/src/components/StatisticsPanel.js
@@ -127,40 +127,49 @@ class StatisticsPanel extends Component 
       title,
       header: {
         cached: "",
         count: "",
         label: L10N.getStr("charts.type"),
         size: L10N.getStr("charts.size"),
         transferredSize: L10N.getStr("charts.transferred"),
         time: L10N.getStr("charts.time"),
+        nonBlockingTime: L10N.getStr("charts.nonBlockingTime"),
       },
       data,
       strings: {
         size: (value) =>
           L10N.getFormatStr("charts.sizeKB", getSizeWithDecimals(value / 1024)),
         transferredSize: (value) =>
           L10N.getFormatStr("charts.transferredSizeKB",
             getSizeWithDecimals(value / 1024)),
         time: (value) =>
           L10N.getFormatStr("charts.totalS", getTimeWithDecimals(value / 1000)),
+        nonBlockingTime: (value) =>
+          L10N.getFormatStr("charts.totalS", getTimeWithDecimals(value / 1000)),
       },
       totals: {
         cached: (total) => L10N.getFormatStr("charts.totalCached", total),
         count: (total) => L10N.getFormatStr("charts.totalCount", total),
         size: (total) =>
           L10N.getFormatStr("charts.totalSize", getSizeWithDecimals(total / 1024)),
         transferredSize: total =>
           L10N.getFormatStr("charts.totalTransferredSize",
             getSizeWithDecimals(total / 1024)),
         time: (total) => {
           let seconds = total / 1000;
           let string = getTimeWithDecimals(seconds);
           return PluralForm.get(seconds,
-            L10N.getStr("charts.totalSeconds")).replace("#1", string);
+            L10N.getFormatStr("charts.totalSeconds", string));
+        },
+        nonBlockingTime: (total) => {
+          let seconds = total / 1000;
+          let string = getTimeWithDecimals(seconds);
+          return PluralForm.get(seconds,
+            L10N.getFormatStr("charts.totalSecondsNonBlocking", string));
         },
       },
       sorted: true,
     });
 
     chart.on("click", (_, { label }) => {
       // Reset FilterButtons and enable one filter exclusively
       this.props.closeStatistics();
@@ -180,16 +189,17 @@ class StatisticsPanel extends Component 
   sanitizeChartDataSource(requests, emptyCache) {
     const data = FILTER_TAGS.map((type) => ({
       cached: 0,
       count: 0,
       label: type,
       size: 0,
       transferredSize: 0,
       time: 0,
+      nonBlockingTime: 0,
     }));
 
     for (let request of requests) {
       let type;
 
       if (Filters.html(request)) {
         // "html"
         type = 0;
@@ -219,16 +229,19 @@ class StatisticsPanel extends Component 
         // "other"
         type = 8;
       }
 
       if (emptyCache || !this.responseIsFresh(request)) {
         data[type].time += request.totalTime || 0;
         data[type].size += request.contentSize || 0;
         data[type].transferredSize += request.transferredSize || 0;
+        let nonBlockingTime =
+           request.eventTimings.totalTime - request.eventTimings.timings.blocked;
+        data[type].nonBlockingTime += nonBlockingTime || 0;
       } else {
         data[type].cached++;
       }
       data[type].count++;
     }
 
     return data.filter(e => e.count > 0);
   }