Bug 1333377 - cap the number of expanded nodes in netmonitor prop view;r=Honza a=gchang
authorJulian Descottes <jdescottes@mozilla.com>
Tue, 24 Jan 2017 12:42:11 +0100
changeset 378172 9c0efc44eaa6738566c77af1e7244f4af2e74821
parent 378171 a2ed1e8da84e31071c331412f352a42e6586fca2
child 378173 7bae7aaeaead7fc722523f52f8dd383b6255fe0b
push id1419
push userjlund@mozilla.com
push dateMon, 10 Apr 2017 20:44:07 +0000
treeherdermozilla-release@5e6801b73ef6 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersHonza, gchang
bugs1333377
milestone53.0a2
Bug 1333377 - cap the number of expanded nodes in netmonitor prop view;r=Honza a=gchang MozReview-Commit-ID: CEh8R0bFF10
devtools/client/netmonitor/shared/components/properties-view.js
devtools/client/netmonitor/test/browser_net_json-long.js
--- a/devtools/client/netmonitor/shared/components/properties-view.js
+++ b/devtools/client/netmonitor/shared/components/properties-view.js
@@ -21,16 +21,17 @@ const { FILTER_SEARCH_DELAY } = require(
 // Components
 const Editor = createFactory(require("devtools/client/netmonitor/shared/components/editor"));
 const SearchBox = createFactory(require("devtools/client/shared/components/search-box"));
 const TreeView = createFactory(require("devtools/client/shared/components/tree/tree-view"));
 const TreeRow = createFactory(require("devtools/client/shared/components/tree/tree-row"));
 
 const { div, tr, td } = DOM;
 const AUTO_EXPAND_MAX_LEVEL = 7;
+const AUTO_EXPAND_MAX_NODES = 50;
 const EDITOR_CONFIG_ID = "EDITOR_CONFIG";
 
 /*
  * Properties View component
  * A scrollable tree view component which provides some useful features for
  * representing object properties.
  *
  * Search filter - Set enableFilter to enable / disable SearchBox feature.
@@ -141,22 +142,32 @@ const PropertiesView = createClass({
     }
 
     if (level > AUTO_EXPAND_MAX_LEVEL) {
       return null;
     }
 
     let expandedNodes = new Set();
     for (let prop in object) {
+      if (expandedNodes.size > AUTO_EXPAND_MAX_NODES) {
+        // If we reached the limit of expandable nodes, bail out to avoid performance
+        // issues.
+        break;
+      }
+
       let nodePath = path + "/" + prop;
       expandedNodes.add(nodePath);
 
       let nodes = this.getExpandedNodes(object[prop], nodePath, level + 1);
       if (nodes) {
-        expandedNodes = new Set([...expandedNodes, ...nodes]);
+        let newSize = expandedNodes.size + nodes.size;
+        if (newSize < AUTO_EXPAND_MAX_NODES) {
+          // Avoid having a subtree half expanded.
+          expandedNodes = new Set([...expandedNodes, ...nodes]);
+        }
       }
     }
     return expandedNodes;
   },
 
   render() {
     const {
       decorator,
--- a/devtools/client/netmonitor/test/browser_net_json-long.js
+++ b/devtools/client/netmonitor/test/browser_net_json-long.js
@@ -60,18 +60,18 @@ add_task(function* () {
       "The response json view has the intended visibility.");
     is(tabpanel.querySelector(".editor-mount iframe") === null, true,
       "The response editor doesn't have the intended visibility.");
     is(tabpanel.querySelector(".response-image-box") === null, true,
       "The response image box doesn't have the intended visibility.");
 
     is(tabpanel.querySelectorAll(".tree-section").length, 1,
       "There should be 1 tree sections displayed in this tabpanel.");
-    is(tabpanel.querySelectorAll(".treeRow:not(.tree-section)").length, 4094,
-      "There should be 4094 json properties displayed in this tabpanel.");
+    is(tabpanel.querySelectorAll(".treeRow:not(.tree-section)").length, 2047,
+      "There should be 2047 json properties displayed in this tabpanel.");
     is(tabpanel.querySelectorAll(".empty-notice").length, 0,
       "The empty notice should not be displayed in this tabpanel.");
 
     is(tabpanel.querySelector(".tree-section .treeLabel").textContent,
       L10N.getStr("jsonScopeName"),
       "The json view section doesn't have the correct title.");
 
     let labels = tabpanel
@@ -79,14 +79,14 @@ add_task(function* () {
     let values = tabpanel
       .querySelectorAll("tr:not(.tree-section) .treeValueCell .objectBox");
 
     is(labels[0].textContent, "0",
       "The first json property name was incorrect.");
     is(values[0].textContent, "Object",
       "The first json property value was incorrect.");
 
-    is(labels[1].textContent, "greeting",
+    is(labels[1].textContent, "1",
       "The second json property name was incorrect.");
-    is(values[1].textContent, "\"Hello long string JSON!\"",
+    is(values[1].textContent, "Object",
       "The second json property value was incorrect.");
   }
 });