Changeset 120621 in webkit

Timestamp:

Jun 18, 2012 1:17:32 PM (12 years ago)

Author:

loislo@chromium.org

Message:

Web Inspector: Implement native memory bar diagram
​https://bugs.webkit.org/show_bug.cgi?id=89106

Patch by Alexei Filippov <​alexeif@chromium.org> on 2012-06-18
Reviewed by Pavel Feldman.

• inspector/front-end/NativeMemorySnapshotView.js:

(WebInspector.NativeMemoryBarChart):
(WebInspector.NativeMemoryBarChart.prototype._updateStats):
(WebInspector.NativeMemoryBarChart.prototype.willHide):
(WebInspector.NativeMemoryBarChart.prototype.wasShown):
(WebInspector.NativeMemoryBarChart.prototype._updateView):

• inspector/front-end/ProfileLauncherView.js:

(WebInspector.ProfileLauncherView):

• inspector/front-end/nativeMemoryProfiler.css:

(.memory-bar-chart-name):
(.memory-bar-chart-bar):
(.memory-bar-chart-size):
(.memory-bar-chart-total):

Location:

trunk/Source/WebCore

Files:

• ChangeLog (modified) (1 diff)
• inspector/front-end/NativeMemorySnapshotView.js (modified) (1 diff)
• inspector/front-end/ProfileLauncherView.js (modified) (1 diff)
• inspector/front-end/nativeMemoryProfiler.css (modified) (1 diff)

trunk/Source/WebCore/ChangeLog

@@ +1 @@
+2012-06-18  Alexei Filippov  <alexeif@chromium.org>
+
+        Web Inspector: Implement native memory bar diagram
+        https://bugs.webkit.org/show_bug.cgi?id=89106
+
+        Reviewed by Pavel Feldman.
+
+        * inspector/front-end/NativeMemorySnapshotView.js:
+        (WebInspector.NativeMemoryBarChart):
+        (WebInspector.NativeMemoryBarChart.prototype._updateStats):
+        (WebInspector.NativeMemoryBarChart.prototype.willHide):
+        (WebInspector.NativeMemoryBarChart.prototype.wasShown):
+        (WebInspector.NativeMemoryBarChart.prototype._updateView):
+        * inspector/front-end/ProfileLauncherView.js:
+        (WebInspector.ProfileLauncherView):
+        * inspector/front-end/nativeMemoryProfiler.css:
+        (.memory-bar-chart-name):
+        (.memory-bar-chart-bar):
+        (.memory-bar-chart-size):
+        (.memory-bar-chart-total):
+
 2012-06-18  Mike West  <mkwst@chromium.org>
 

trunk/Source/WebCore/inspector/front-end/NativeMemorySnapshotView.js

@@ -366 +366 @@
 
 WebInspector.NativeMemoryPieChart.prototype.__proto__ = WebInspector.View.prototype;
+
+/**
+ * @constructor
+ * @extends {WebInspector.View}
+ */
+WebInspector.NativeMemoryBarChart = function()
+{
+    WebInspector.View.call(this);
+    this.registerRequiredCSS("nativeMemoryProfiler.css");
+    this._memorySnapshot = null;
+    this.element = document.createElement("div");
+    this._table = this.element.createChild("table");
+    this._bars = {};
+    this._sizes = {};
+    var row = this._table.insertRow();
+    this._totalDiv = row.insertCell().createChild("div");
+    this._totalDiv.addStyleClass("memory-bar-chart-total");
+    row.insertCell();
+}
+
+WebInspector.NativeMemoryBarChart.prototype = {
+    _updateStats: function()
+    {
+        function didReceiveMemorySnapshot(error, memoryBlock)
+        {
+            if (memoryBlock.size && memoryBlock.children) {
+                var knownSize = 0;
+                for (var i = 0; i < memoryBlock.children.length; i++) {
+                    var size = memoryBlock.children[i].size;
+                    if (size)
+                        knownSize += size;
+                }
+                var otherSize = memoryBlock.size - knownSize;
+
+                if (otherSize) {
+                    memoryBlock.children.push({
+                        name: "Other",
+                        size: otherSize
+                    });
+                }
+            }
+            this._memorySnapshot = memoryBlock;
+            this._updateView();
+        }
+        MemoryAgent.getProcessMemoryDistribution(didReceiveMemorySnapshot.bind(this));
+    },
+
+    /**
+     * @override
+     */
+    willHide: function()
+    {
+        clearInterval(this._timerId);
+    },
+
+    /**
+     * @override
+     */
+    wasShown: function()
+    {
+        this._timerId = setInterval(this._updateStats.bind(this), 200);
+    },
+
+    _updateView: function()
+    {
+        var memoryBlock = this._memorySnapshot;
+        if (!memoryBlock)
+            return;
+
+        var MB = 1024 * 1024;
+        var maxSize = 100 * MB;
+        for (var i = 0; i < memoryBlock.children.length; ++i)
+            maxSize = Math.max(maxSize, memoryBlock.children[i].size);
+        var maxBarLength = 500;
+        var barLengthSizeRatio = maxBarLength / maxSize;
+
+        for (var i = memoryBlock.children.length - 1; i >= 0 ; --i) {
+            var child = memoryBlock.children[i];
+            var name = child.name;
+            var barDiv = this._bars[name];
+            if (!barDiv) {
+                var row = this._table.insertRow();
+                var nameDiv = row.insertCell(-1).createChild("div");
+                var viewProperties = WebInspector.MemoryBlockViewProperties._forMemoryBlock(child);
+                var title = viewProperties._description;
+                nameDiv.textContent = title;
+                nameDiv.addStyleClass("memory-bar-chart-name");
+                var barCell = row.insertCell(-1);
+                barDiv = barCell.createChild("div");
+                barDiv.addStyleClass("memory-bar-chart-bar");
+                var viewProperties = WebInspector.MemoryBlockViewProperties._forMemoryBlock(child);
+                barDiv.style.backgroundColor = viewProperties._fillStyle;
+                this._bars[name] = barDiv;
+                var sizeDiv = barCell.createChild("div");
+                sizeDiv.addStyleClass("memory-bar-chart-size");
+                this._sizes[name] = sizeDiv;
+            }
+            barDiv.style.width = child.size * barLengthSizeRatio + "px";
+            barDiv.textContent = (child.size / memoryBlock.size * 100).toFixed(0) + "%";
+            var sizeDiv = this._sizes[name];
+            sizeDiv.textContent = (child.size / MB).toFixed(1) + "\u2009MB";
+        }
+
+        var viewProperties = WebInspector.MemoryBlockViewProperties._forMemoryBlock(memoryBlock);
+        this._totalDiv.textContent = viewProperties._description + ": " + (memoryBlock.size / MB).toFixed(1) + "\u2009MB";
+    }
+}
+
+WebInspector.NativeMemoryBarChart.prototype.__proto__ = WebInspector.View.prototype;

trunk/Source/WebCore/inspector/front-end/ProfileLauncherView.js

@@ -51 +51 @@
 
     this._profileTypeSelectorForm = this._contentElement.createChild("form");
+
+    this._nativeMemoryElement = document.createElement("div");
+    this._contentElement.appendChild(this._nativeMemoryElement);
+    this._nativeMemoryLiveChart = new WebInspector.NativeMemoryBarChart();
+    this._nativeMemoryLiveChart.show(this._nativeMemoryElement);
+
     this._contentElement.createChild("div", "flexible-space");
 

trunk/Source/WebCore/inspector/front-end/nativeMemoryProfiler.css

@@ -50 +50 @@
     margin: 10px;
 }
+
+.memory-bar-chart-name {
+    text-align: right;
+    white-space: nowrap;
+}
+
+.memory-bar-chart-bar {
+    border: 1px solid #bbb;
+    border-radius: 3px;
+    float: left;
+    height: 20px;
+    text-align: center;
+    overflow: hidden;
+}
+
+.memory-bar-chart-size {
+    text-indent: 6px;
+    white-space: nowrap;
+}
+
+.memory-bar-chart-total {
+    font-weight: bold;
+}