[SCM] WebKit Debian packaging branch, debian/experimental, updated. upstream/1.3.3-9427-gc2be6fc
pfeldman at chromium.org
pfeldman at chromium.org
Wed Dec 22 11:30:27 UTC 2010
The following commit has been merged in the debian/experimental branch:
commit 50be6ca4af0eb379994b8849d2d0abfc589075de
Author: pfeldman at chromium.org <pfeldman at chromium.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Date: Tue Jul 27 18:32:43 2010 +0000
2010-07-27 Pavel Feldman <pfeldman at chromium.org>
Reviewed by Joseph Pecoraro.
Web Inspector: render network timing as gant chart in popover.
https://bugs.webkit.org/show_bug.cgi?id=43051
* inspector/InspectorResource.cpp:
(WebCore::InspectorResource::buildObjectForTiming):
* inspector/front-end/ResourcesPanel.js:
(WebInspector.ResourcesPanel.prototype._showPopover):
* inspector/front-end/inspector.css:
(.resource-timing-row):
(.resource-timing-bar):
(.resource-timing-bar-title):
* inspector/front-end/utilities.js:
git-svn-id: http://svn.webkit.org/repository/webkit/trunk@64144 268f45cc-cd09-0410-ab3c-d52691b4dbfc
diff --git a/WebCore/ChangeLog b/WebCore/ChangeLog
index 25bd1a5..90622e2 100644
--- a/WebCore/ChangeLog
+++ b/WebCore/ChangeLog
@@ -1,3 +1,21 @@
+2010-07-27 Pavel Feldman <pfeldman at chromium.org>
+
+ Reviewed by Joseph Pecoraro.
+
+ Web Inspector: render network timing as gant chart in popover.
+
+ https://bugs.webkit.org/show_bug.cgi?id=43051
+
+ * inspector/InspectorResource.cpp:
+ (WebCore::InspectorResource::buildObjectForTiming):
+ * inspector/front-end/ResourcesPanel.js:
+ (WebInspector.ResourcesPanel.prototype._showPopover):
+ * inspector/front-end/inspector.css:
+ (.resource-timing-row):
+ (.resource-timing-bar):
+ (.resource-timing-bar-title):
+ * inspector/front-end/utilities.js:
+
2010-07-27 Victor Wang <victorw at chromium.org>
Unreviewed, rolling out r64104.
diff --git a/WebCore/inspector/InspectorResource.cpp b/WebCore/inspector/InspectorResource.cpp
index 6a5919c..3ba3bf2 100644
--- a/WebCore/inspector/InspectorResource.cpp
+++ b/WebCore/inspector/InspectorResource.cpp
@@ -394,12 +394,17 @@ ScriptObject InspectorResource::buildObjectForTiming(InspectorFrontend* frontend
{
ScriptObject jsonObject = frontend->newScriptObject();
jsonObject.set("requestTime", timing->requestTime);
- jsonObject.set("proxyDuration", timing->proxyStart == -1 ? -1 : (timing->proxyEnd - timing->proxyStart) / 1000.0);
- jsonObject.set("dnsDuration", timing->dnsStart == -1 ? -1 : (timing->dnsEnd - timing->dnsStart) / 1000.0);
- jsonObject.set("connectDuration", timing->connectStart == -1 ? -1 : (timing->connectEnd - timing->connectStart) / 1000.0);
- jsonObject.set("sslDuration", timing->sslStart == -1 ? -1 : (timing->sslEnd - timing->sslStart) / 1000.0);
- jsonObject.set("sendDuration", (timing->sendEnd - timing->sendStart) / 1000.0);
- jsonObject.set("waitDuration", (timing->receiveHeadersEnd - timing->sendEnd) / 1000.0);
+ jsonObject.set("proxyStart", timing->proxyStart);
+ jsonObject.set("proxyEnd", timing->proxyEnd);
+ jsonObject.set("dnsStart", timing->dnsStart);
+ jsonObject.set("dnsEnd", timing->dnsEnd);
+ jsonObject.set("connectStart", timing->connectStart);
+ jsonObject.set("connectEnd", timing->connectEnd);
+ jsonObject.set("sslStart", timing->sslStart);
+ jsonObject.set("sslEnd", timing->sslEnd);
+ jsonObject.set("sendStart", timing->sendStart);
+ jsonObject.set("sendEnd", timing->sendEnd);
+ jsonObject.set("receiveHeadersEnd", timing->receiveHeadersEnd);
return jsonObject;
}
diff --git a/WebCore/inspector/front-end/ResourcesPanel.js b/WebCore/inspector/front-end/ResourcesPanel.js
index 2ad62a9..4fda07b 100644
--- a/WebCore/inspector/front-end/ResourcesPanel.js
+++ b/WebCore/inspector/front-end/ResourcesPanel.js
@@ -792,61 +792,83 @@ WebInspector.ResourcesPanel.prototype = {
{
var tableElement = document.createElement("table");
var resource = anchor.parentElement.resource;
- var data = [];
+ var rows = [];
- if (resource.timing.proxyDuration !== -1) {
- data.push(WebInspector.UIString("Proxy"));
- data.push(Number.secondsToString(resource.timing.proxyDuration));
+ function addRow(title, start, end, color)
+ {
+ var row = {};
+ row.title = title;
+ row.start = start;
+ row.end = end;
+ rows.push(row);
}
- if (resource.timing.dnsDuration !== -1) {
- data.push(WebInspector.UIString("DNS Lookup"));
- data.push(Number.secondsToString(resource.timing.dnsDuration));
+ if (resource.timing.proxyStart !== -1)
+ addRow(WebInspector.UIString("Proxy"), resource.timing.proxyStart, resource.timing.proxyEnd);
+
+ if (resource.timing.dnsStart !== -1) {
+ addRow(WebInspector.UIString("DNS Lookup"), resource.timing.dnsStart, resource.timing.dnsEnd);
}
- if (resource.timing.connectDuration !== -1) {
- if (resource.connectionReused) {
- data.push(WebInspector.UIString("Blocking"));
- data.push(Number.secondsToString(resource.timing.connectDuration));
- } else {
- data.push(WebInspector.UIString("Connecting"));
+ if (resource.timing.connectStart !== -1) {
+ if (resource.connectionReused)
+ addRow(WebInspector.UIString("Blocking"), resource.timing.connectStart, resource.timing.connectEnd);
+ else {
+ var connectStart = resource.timing.connectStart;
// Connection includes DNS, subtract it here.
- var connectDuration = resource.timing.connectDuration;
- if (resource.timing.dnsDuration !== -1)
- connectDuration -= resource.timing.dnsDuration;
- data.push(Number.secondsToString(connectDuration));
+ if (resource.timing.dnsStart !== -1)
+ connectStart += resource.timing.dnsEnd - resource.timing.dnsStart;
+ addRow(WebInspector.UIString("Connecting"), connectStart, resource.timing.connectEnd);
}
}
- if (resource.timing.sslDuration !== -1) {
- data.push(WebInspector.UIString("SSL"));
- data.push(Number.secondsToString(resource.timing.sslDuration));
- }
-
- data.push(WebInspector.UIString("Sending"));
- data.push(Number.secondsToString(resource.timing.sendDuration));
+ if (resource.timing.sslStart !== -1)
+ addRow(WebInspector.UIString("SSL"), resource.timing.sslStart, resource.timing.sslEnd);
- data.push(WebInspector.UIString("Waiting"));
- // Waiting includes SSL, subtract it here.
- var waitDuration = resource.timing.waitDuration;
- if (resource.timing.sslDuration !== -1)
- waitDuration -= resource.timing.sslDuration;
- data.push(Number.secondsToString(waitDuration));
+ var sendStart = resource.timing.sendStart;
+ if (resource.timing.sslStart !== -1)
+ sendStart += resource.timing.sslEnd - resource.timing.sslStart;
+
+ addRow(WebInspector.UIString("Sending"), resource.timing.sendStart, resource.timing.sendEnd);
+ addRow(WebInspector.UIString("Waiting"), resource.timing.sendEnd, resource.timing.receiveHeadersEnd);
+ addRow(WebInspector.UIString("Receiving"), (resource.responseReceivedTime - resource.timing.requestTime) * 1000, (resource.endTime - resource.timing.requestTime) * 1000);
- data.push(WebInspector.UIString("Receiving"));
- data.push(Number.secondsToString(resource.endTime - resource.responseReceivedTime));
+ const chartWidth = 200;
+ var total = (resource.endTime - resource.timing.requestTime) * 1000;
+ var scale = chartWidth / total;
- for (var i = 0; i < data.length; i += 2) {
+ for (var i = 0; i < rows.length; ++i) {
var tr = document.createElement("tr");
tableElement.appendChild(tr);
var td = document.createElement("td");
- td.textContent = data[i];
+ td.textContent = rows[i].title;
tr.appendChild(td);
td = document.createElement("td");
- td.align = "right";
- td.textContent = data[i + 1];
+ td.width = chartWidth + "px";
+
+ var row = document.createElement("div");
+ row.className = "resource-timing-row";
+ td.appendChild(row);
+
+ var bar = document.createElement("span");
+ bar.className = "resource-timing-bar";
+ bar.style.left = scale * rows[i].start + "px";
+ bar.style.right = scale * (total - rows[i].end) + "px";
+ bar.style.backgroundColor = rows[i].color;
+ bar.textContent = "\u200B"; // Important for 0-time items to have 0 width.
+ row.appendChild(bar);
+
+ var title = document.createElement("span");
+ title.className = "resource-timing-bar-title";
+ if (i >= rows.length - 2)
+ title.style.right = (scale * (total - rows[i].end) + 3) + "px";
+ else
+ title.style.left = (scale * rows[i].start + 3) + "px";
+ title.textContent = Number.millisToString(rows[i].end - rows[i].start);
+ row.appendChild(title);
+
tr.appendChild(td);
}
diff --git a/WebCore/inspector/front-end/inspector.css b/WebCore/inspector/front-end/inspector.css
index f1ee49f..8c4a2ea 100644
--- a/WebCore/inspector/front-end/inspector.css
+++ b/WebCore/inspector/front-end/inspector.css
@@ -977,6 +977,22 @@ body.platform-linux .monospace, body.platform-linux .source-code {
content: "\A";
}
+.resource-timing-row {
+ position: relative;
+ height: 12px;
+}
+
+.resource-timing-bar {
+ position: absolute;
+ background-color: red;
+ border-left: 1px solid red;
+ opacity: 0.4;
+}
+
+.resource-timing-bar-title {
+ position: absolute;
+}
+
#elements-content {
display: block;
overflow: auto;
diff --git a/WebCore/inspector/front-end/utilities.js b/WebCore/inspector/front-end/utilities.js
index 6e7c725..d248071 100644
--- a/WebCore/inspector/front-end/utilities.js
+++ b/WebCore/inspector/front-end/utilities.js
@@ -639,6 +639,11 @@ function parentNode(node)
return node.parentNode;
}
+Number.millisToString = function(ms, formatterFunction, higherResolution)
+{
+ return Number.secondsToString(ms / 1000, formatterFunction, higherResolution);
+}
+
Number.secondsToString = function(seconds, formatterFunction, higherResolution)
{
if (!formatterFunction)
--
WebKit Debian packaging
More information about the Pkg-webkit-commits
mailing list