Changeset 218908 in webkit

Timestamp:

Jun 28, 2017 6:34:51 PM (7 years ago)

Author:

Devin Rousso

Message:

Web Inspector: Instrument active pixel memory used by canvases
​https://bugs.webkit.org/show_bug.cgi?id=173087
<rdar://problem/32719261>

Reviewed by Joseph Pecoraro.

Source/JavaScriptCore:

• inspector/protocol/Canvas.json:
  • Add optional memoryCost attribute to the Canvas type.
  • Add canvasMemoryChanged event that is dispatched when the memoryCost of a canvas changes.

Source/WebCore:

Test: inspector/canvas/memory.html

• html/HTMLCanvasElement.cpp:

(WebCore::HTMLCanvasElement::setImageBuffer):

• inspector/InspectorCanvasAgent.h:
• inspector/InspectorCanvasAgent.cpp:

(WebCore::InspectorCanvasAgent::didChangeCanvasMemory):
(WebCore::InspectorCanvasAgent::buildObjectForCanvas):

• inspector/InspectorInstrumentation.h:
• inspector/InspectorInstrumentation.cpp:

(WebCore::InspectorInstrumentation::didChangeCanvasMemory):
(WebCore::InspectorInstrumentation::didChangeCanvasMemoryImpl):

Source/WebInspectorUI:

• .eslintrc:
• UserInterface/Controllers/CanvasManager.js:

(WebInspector.CanvasManager.prototype.canvasMemoryChanged):

• UserInterface/Models/Canvas.js:

(WebInspector.Canvas.fromPayload):
(WebInspector.Canvas.prototype.get memoryCost):
(WebInspector.Canvas.prototype.set memoryCost):

• UserInterface/Protocol/CanvasObserver.js:

(WebInspector.CanvasObserver.prototype.canvasMemoryChanged):

• UserInterface/Views/CanvasDetailsSidebarPanel.js:

(WebInspector.CanvasDetailsSidebarPanel.prototype.initialLayout):
(WebInspector.CanvasDetailsSidebarPanel.prototype._refreshIdentitySection):
(WebInspector.CanvasDetailsSidebarPanel.prototype._formatMemoryRow):
(WebInspector.CanvasDetailsSidebarPanel.prototype._canvasMemoryChanged):

• Localizations/en.lproj/localizedStrings.js:
• UserInterface/Base/Utilities.js:

(Number.bytesToString.value):
Add support for gigabyte numbers.

LayoutTests:

• inspector/canvas/memory-expected.txt: Added.
• inspector/canvas/memory.html: Added.

Location:

trunk

Files:

• LayoutTests/ChangeLog (modified) (1 diff)
• LayoutTests/inspector/canvas/memory-expected.txt (added)
• LayoutTests/inspector/canvas/memory.html (added)
• Source/JavaScriptCore/ChangeLog (modified) (1 diff)
• Source/JavaScriptCore/inspector/protocol/Canvas.json (modified) (2 diffs)
• Source/WebCore/ChangeLog (modified) (1 diff)
• Source/WebCore/html/HTMLCanvasElement.cpp (modified) (1 diff)
• Source/WebCore/inspector/InspectorCanvasAgent.cpp (modified) (2 diffs)
• Source/WebCore/inspector/InspectorCanvasAgent.h (modified) (1 diff)
• Source/WebCore/inspector/InspectorInstrumentation.cpp (modified) (1 diff)
• Source/WebCore/inspector/InspectorInstrumentation.h (modified) (3 diffs)
• Source/WebInspectorUI/.eslintrc (modified) (1 diff)
• Source/WebInspectorUI/ChangeLog (modified) (1 diff)
• Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js (modified) (3 diffs)
• Source/WebInspectorUI/UserInterface/Base/Utilities.js (modified) (1 diff)
• Source/WebInspectorUI/UserInterface/Controllers/CanvasManager.js (modified) (1 diff)
• Source/WebInspectorUI/UserInterface/Models/Canvas.js (modified) (5 diffs)
• Source/WebInspectorUI/UserInterface/Protocol/CanvasObserver.js (modified) (1 diff)
• Source/WebInspectorUI/UserInterface/Views/CanvasDetailsSidebarPanel.js (modified) (5 diffs)

trunk/LayoutTests/ChangeLog

@@ +1 @@
+2017-06-28  Devin Rousso  <drousso@apple.com>
+
+        Web Inspector: Instrument active pixel memory used by canvases
+        https://bugs.webkit.org/show_bug.cgi?id=173087
+        <rdar://problem/32719261>
+
+        Reviewed by Joseph Pecoraro.
+
+        * inspector/canvas/memory-expected.txt: Added.
+        * inspector/canvas/memory.html: Added.
+
 2017-06-28  Ryan Haddad  <ryanhaddad@apple.com>
 

trunk/Source/JavaScriptCore/ChangeLog

@@ +1 @@
+2017-06-28  Devin Rousso  <drousso@apple.com>
+
+        Web Inspector: Instrument active pixel memory used by canvases
+        https://bugs.webkit.org/show_bug.cgi?id=173087
+        <rdar://problem/32719261>
+
+        Reviewed by Joseph Pecoraro.
+
+        * inspector/protocol/Canvas.json:
+         - Add optional `memoryCost` attribute to the `Canvas` type.
+         - Add `canvasMemoryChanged` event that is dispatched when the `memoryCost` of a canvas changes.
+
 2017-06-28  Joseph Pecoraro  <pecoraro@apple.com>
 

trunk/Source/JavaScriptCore/inspector/protocol/Canvas.json

@@ -39 +39 @@
                 { "name": "nodeId", "$ref": "DOM.NodeId", "optional": true, "description": "The corresponding DOM node id." },
                 { "name": "cssCanvasName", "type": "string", "optional": true, "description": "The CSS canvas identifier, for canvases created with <code>document.getCSSCanvasContext</code>." },
-                { "name": "contextAttributes", "$ref": "ContextAttributes", "optional": true, "description": "Context attributes for WebGL rendering contexts." }
+                { "name": "contextAttributes", "$ref": "ContextAttributes", "optional": true, "description": "Context attributes for WebGL rendering contexts." },
+                { "name": "memoryCost", "type": "number", "optional": true, "description": "Memory usage of the canvas in bytes." }
             ]
         }
@@ -85 +86 @@
                 { "name": "canvasId", "$ref": "CanvasId", "description": "Removed canvas identifier." }
             ]
+        },
+        {
+            "name": "canvasMemoryChanged",
+            "parameters": [
+                { "name": "canvasId", "$ref": "CanvasId", "description": "Identifier of canvas that changed." },
+                { "name": "memoryCost", "type": "number", "description": "New memory cost value for the canvas in bytes." }
+            ]
         }
     ]

trunk/Source/WebCore/ChangeLog

@@ +1 @@
+2017-06-28  Devin Rousso  <drousso@apple.com>
+
+        Web Inspector: Instrument active pixel memory used by canvases
+        https://bugs.webkit.org/show_bug.cgi?id=173087
+        <rdar://problem/32719261>
+
+        Reviewed by Joseph Pecoraro.
+
+        Test: inspector/canvas/memory.html
+
+        * html/HTMLCanvasElement.cpp:
+        (WebCore::HTMLCanvasElement::setImageBuffer):
+        * inspector/InspectorCanvasAgent.h:
+        * inspector/InspectorCanvasAgent.cpp:
+        (WebCore::InspectorCanvasAgent::didChangeCanvasMemory):
+        (WebCore::InspectorCanvasAgent::buildObjectForCanvas):
+        * inspector/InspectorInstrumentation.h:
+        * inspector/InspectorInstrumentation.cpp:
+        (WebCore::InspectorInstrumentation::didChangeCanvasMemory):
+        (WebCore::InspectorInstrumentation::didChangeCanvasMemoryImpl):
+
 2017-06-28  Alex Christensen  <achristensen@webkit.org>
 

trunk/Source/WebCore/html/HTMLCanvasElement.cpp

@@ -757 +757 @@
 void HTMLCanvasElement::setImageBuffer(std::unique_ptr<ImageBuffer> buffer) const
 {
-    removeFromActivePixelMemory(memoryCost());
+    size_t previousMemoryCost = memoryCost();
+    removeFromActivePixelMemory(previousMemoryCost);
 
     m_imageBuffer = WTFMove(buffer);
 
-    activePixelMemory += memoryCost();
+    size_t currentMemoryCost = memoryCost();
+    activePixelMemory += currentMemoryCost;
+
+    if (m_imageBuffer && previousMemoryCost != currentMemoryCost)
+        InspectorInstrumentation::didChangeCanvasMemory(const_cast<HTMLCanvasElement&>(*this));
 }
 

trunk/Source/WebCore/inspector/InspectorCanvasAgent.cpp

@@ -181 +181 @@
 }
 
+void InspectorCanvasAgent::didChangeCanvasMemory(HTMLCanvasElement& canvasElement)
+{
+    CanvasEntry* canvasEntry = getCanvasEntry(canvasElement);
+    if (!canvasEntry)
+        return;
+
+    m_frontendDispatcher->canvasMemoryChanged(canvasEntry->identifier, canvasElement.memoryCost());
+}
+
 void InspectorCanvasAgent::canvasDestroyed(HTMLCanvasElement& canvasElement)
 {
@@ -296 +305 @@
 #endif
 
+    if (size_t memoryCost = canvasElement.memoryCost())
+        canvas->setMemoryCost(memoryCost);
+
     return canvas;
 }

trunk/Source/WebCore/inspector/InspectorCanvasAgent.h

@@ -65 +65 @@
     void didCreateCSSCanvas(HTMLCanvasElement&, const String&);
     void didCreateCanvasRenderingContext(HTMLCanvasElement&);
+    void didChangeCanvasMemory(HTMLCanvasElement&);
 
     // CanvasObserver

trunk/Source/WebCore/inspector/InspectorInstrumentation.cpp

@@ -1006 +1006 @@
 }
 
+void InspectorInstrumentation::didChangeCanvasMemoryImpl(InstrumentingAgents* instrumentingAgents, HTMLCanvasElement& canvasElement)
+{
+    if (InspectorCanvasAgent* canvasAgent = instrumentingAgents->inspectorCanvasAgent())
+        canvasAgent->didChangeCanvasMemory(canvasElement);
+}
+
 #if ENABLE(WEB_REPLAY)
 void InspectorInstrumentation::sessionCreatedImpl(InstrumentingAgents& instrumentingAgents, RefPtr<ReplaySession>&& session)

trunk/Source/WebCore/inspector/InspectorInstrumentation.h

@@ -248 +248 @@
     static void didCreateCSSCanvas(HTMLCanvasElement&, const String&);
     static void didCreateCanvasRenderingContext(HTMLCanvasElement&);
+    static void didChangeCanvasMemory(HTMLCanvasElement&);
 
     static void networkStateChanged(Page&);
@@ -423 +424 @@
     static void didCreateCSSCanvasImpl(InstrumentingAgents*, HTMLCanvasElement&, const String&);
     static void didCreateCanvasRenderingContextImpl(InstrumentingAgents*, HTMLCanvasElement&);
+    static void didChangeCanvasMemoryImpl(InstrumentingAgents*, HTMLCanvasElement&);
 
     static void layerTreeDidChangeImpl(InstrumentingAgents&);
@@ -1194 +1196 @@
 }
 
+inline void InspectorInstrumentation::didChangeCanvasMemory(HTMLCanvasElement& canvasElement)
+{
+    FAST_RETURN_IF_NO_FRONTENDS(void());
+    if (InstrumentingAgents* instrumentingAgents = instrumentingAgentsForDocument(&canvasElement.document()))
+        didChangeCanvasMemoryImpl(instrumentingAgents, canvasElement);
+}
+
 inline void InspectorInstrumentation::networkStateChanged(Page& page)
 {

trunk/Source/WebInspectorUI/.eslintrc

@@ -35 +35 @@
         "ApplicationCacheAgent": true,
         "CSSAgent": true,
+        "CanvasAgent": true,
         "ConsoleAgent": true,
         "DOMAgent": true,

trunk/Source/WebInspectorUI/ChangeLog

@@ +1 @@
+2017-06-28  Devin Rousso  <drousso@apple.com>
+
+        Web Inspector: Instrument active pixel memory used by canvases
+        https://bugs.webkit.org/show_bug.cgi?id=173087
+        <rdar://problem/32719261>
+
+        Reviewed by Joseph Pecoraro.
+
+        * .eslintrc:
+        * UserInterface/Controllers/CanvasManager.js:
+        (WebInspector.CanvasManager.prototype.canvasMemoryChanged):
+        * UserInterface/Models/Canvas.js:
+        (WebInspector.Canvas.fromPayload):
+        (WebInspector.Canvas.prototype.get memoryCost):
+        (WebInspector.Canvas.prototype.set memoryCost):
+        * UserInterface/Protocol/CanvasObserver.js:
+        (WebInspector.CanvasObserver.prototype.canvasMemoryChanged):
+        * UserInterface/Views/CanvasDetailsSidebarPanel.js:
+        (WebInspector.CanvasDetailsSidebarPanel.prototype.initialLayout):
+        (WebInspector.CanvasDetailsSidebarPanel.prototype._refreshIdentitySection):
+        (WebInspector.CanvasDetailsSidebarPanel.prototype._formatMemoryRow):
+        (WebInspector.CanvasDetailsSidebarPanel.prototype._canvasMemoryChanged):
+
+        * Localizations/en.lproj/localizedStrings.js:
+        * UserInterface/Base/Utilities.js:
+        (Number.bytesToString.value):
+        Add support for gigabyte numbers.
+
 2017-06-27  Joseph Pecoraro  <pecoraro@apple.com>
 

trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js

@@ -6 +6 @@
 localizedStrings["%.0f B"] = "%.0f B";
 localizedStrings["%.0fms"] = "%.0fms";
+localizedStrings["%.1f GB"] = "%.1f GB";
 localizedStrings["%.1f KB"] = "%.1f KB";
 localizedStrings["%.1f MB"] = "%.1f MB";
@@ -15 +16 @@
 localizedStrings["%.1fmin"] = "%.1fmin";
 localizedStrings["%.1fms"] = "%.1fms";
+localizedStrings["%.2f GB"] = "%.2f GB";
 localizedStrings["%.2f KB"] = "%.2f KB";
 localizedStrings["%.2f MB"] = "%.2f MB";
@@ -543 +545 @@
 localizedStrings["Medium"] = "Medium";
 localizedStrings["Memory"] = "Memory";
+localizedStrings["Memory usage of this canvas"] = "Memory usage of this canvas";
 localizedStrings["Memory: %s"] = "Memory: %s";
 localizedStrings["Message"] = "Message";

trunk/Source/WebInspectorUI/UserInterface/Base/Utilities.js

@@ -1082 +1082 @@
 
         let megabytes = kilobytes / 1024;
-        if (higherResolution || Math.abs(megabytes) < 10)
-            return WebInspector.UIString("%.2f MB").format(megabytes);
-        return WebInspector.UIString("%.1f MB").format(megabytes);
+        if (Math.abs(megabytes) < 1024) {
+            if (higherResolution || Math.abs(megabytes) < 10)
+                return WebInspector.UIString("%.2f MB").format(megabytes);
+            return WebInspector.UIString("%.1f MB").format(megabytes);
+        }
+
+        let gigabytes = megabytes / 1024;
+        if (higherResolution || Math.abs(gigabytes) < 10)
+            return WebInspector.UIString("%.2f GB").format(gigabytes);
+        return WebInspector.UIString("%.1f GB").format(gigabytes);
     }
 });

trunk/Source/WebInspectorUI/UserInterface/Controllers/CanvasManager.js

@@ -73 +73 @@
     }
 
+    canvasMemoryChanged(canvasIdentifier, memoryCost)
+    {
+        // Called from WebInspector.CanvasObserver.
+
+        let canvas = this._canvasIdentifierMap.get(canvasIdentifier);
+        console.assert(canvas);
+        if (!canvas)
+            return;
+
+        canvas.memoryCost = memoryCost;
+    }
+
     // Private
 

trunk/Source/WebInspectorUI/UserInterface/Models/Canvas.js

@@ -26 +26 @@
 WebInspector.Canvas = class Canvas extends WebInspector.Object
 {
-    constructor(identifier, contextType, frame, {domNode, cssCanvasName, contextAttributes} = {})
+    constructor(identifier, contextType, frame, {domNode, cssCanvasName, contextAttributes, memoryCost} = {})
     {
         super();
@@ -40 +40 @@
         this._cssCanvasName = cssCanvasName || "";
         this._contextAttributes = contextAttributes || {};
+        this._memoryCost = memoryCost || NaN;
     }
 
@@ -63 +64 @@
             cssCanvasName: payload.cssCanvasName,
             contextAttributes: payload.contextAttributes,
+            memoryCost: payload.memoryCost,
         });
     }
@@ -90 +92 @@
     get cssCanvasName() { return this._cssCanvasName; }
     get contextAttributes() { return this._contextAttributes; }
+
+    get memoryCost()
+    {
+        return this._memoryCost;
+    }
+
+    set memoryCost(memoryCost)
+    {
+        if (memoryCost === this._memoryCost)
+            return;
+
+        this._memoryCost = memoryCost;
+
+        this.dispatchEventToListeners(WebInspector.Canvas.Event.MemoryChanged);
+    }
 
     get displayName()
@@ -162 +179 @@
 
 WebInspector.Canvas.ResourceSidebarType = "resource-type-canvas";
+
+WebInspector.Canvas.Event = {
+    MemoryChanged: "canvas-memory-changed",
+};

trunk/Source/WebInspectorUI/UserInterface/Protocol/CanvasObserver.js

@@ -37 +37 @@
         WebInspector.canvasManager.canvasRemoved(canvasId);
     }
+
+    canvasMemoryChanged(canvasId, memoryCost)
+    {
+        WebInspector.canvasManager.canvasMemoryChanged(canvasId, memoryCost);
+    }
 };

trunk/Source/WebInspectorUI/UserInterface/Views/CanvasDetailsSidebarPanel.js

@@ -58 +58 @@
             return;
 
-        this._canvas = canvas || null;
-
         if (this._node) {
             this._node.removeEventListener(WebInspector.DOMNode.Event.AttributeModified, this._refreshSourceSection, this);
@@ -67 +65 @@
         }
 
+        if (this._canvas)
+            this._canvas.removeEventListener(WebInspector.Canvas.Event.MemoryChanged, this._canvasMemoryChanged, this);
+
+        this._canvas = canvas || null;
+
+        if (this._canvas)
+            this._canvas.addEventListener(WebInspector.Canvas.Event.MemoryChanged, this._canvasMemoryChanged, this);
+
         this.needsLayout();
     }
@@ -78 +84 @@
         this._nameRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Name"));
         this._typeRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Type"));
+        this._memoryRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Memory"));
 
         let identitySection = new WebInspector.DetailsSection("canvas-details", WebInspector.UIString("Identity"));
-        identitySection.groups = [new WebInspector.DetailsSectionGroup([this._nameRow, this._typeRow])];
+        identitySection.groups = [new WebInspector.DetailsSectionGroup([this._nameRow, this._typeRow, this._memoryRow])];
         this.contentView.element.appendChild(identitySection.element);
 
@@ -129 +136 @@
         this._nameRow.value = this._canvas.displayName;
         this._typeRow.value = WebInspector.Canvas.displayNameForContextType(this._canvas.contextType);
+        this._formatMemoryRow();
     }
 
@@ -231 +239 @@
         dataGrid.updateLayoutIfNeeded();
     }
+
+    _formatMemoryRow()
+    {
+        if (!this._canvas.memoryCost || isNaN(this._canvas.memoryCost)) {
+            this._memoryRow.value = emDash;
+            return;
+        }
+
+        let canvasMemory = Number.bytesToString(this._canvas.memoryCost);
+        this._memoryRow.value = canvasMemory;
+        this._memoryRow.tooltip = WebInspector.UIString("Memory usage of this canvas");
+    }
+
+    _canvasMemoryChanged(event)
+    {
+        this._formatMemoryRow();
+    }
 };