Reduce number of expensive calls to List.redraw() during load of settings page.

chrome/browser/resources/shared/js/cr/ui/list.js

 // Copyright (c) 2012 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 // require: array_data_model.js
 // require: list_selection_model.js
 // require: list_selection_controller.js
 // require: list_item.js
 
 /**
@@ skipping 930 matching lines @@
         return {
           first: firstIndex,
           length: lastIndex - firstIndex + 1,
           last: lastIndex + 1};
       }
     },
 
     /**
      * Merges list items currently existing in the list with items in the range
      * [firstIndex, lastIndex). Removes or adds items if needed.
-     * Doesn't delete {@code this.pinnedItem_} if it presents (instead hides if
-     * it's out of the range). Also adds the items to {@code newCachedItems}.
+     * Doesn't delete {@code this.pinnedItem_} if it is present (instead hides
+     * it if it is out of the range). Adds items to {@code newCachedItems}.
      * @param {number} firstIndex The index of first item, inclusively.
      * @param {number} lastIndex The index of last item, exclusively.
      * @param {Object.<string, ListItem>} cachedItems Old items cache.
      * @param {Object.<string, ListItem>} newCachedItems New items cache.
      */
     mergeItems: function(firstIndex, lastIndex, cachedItems, newCachedItems) {
+      var self = this;
       var dataModel = this.dataModel;
+      var currentIndex = firstIndex;
 
-      function insert(to) {
+      function insert() {
         var dataItem = dataModel.item(currentIndex);
-        var newItem = cachedItems[currentIndex] || to.createItem(dataItem);
+        var newItem = cachedItems[currentIndex] || self.createItem(dataItem);
         newItem.listIndex = currentIndex;
         newCachedItems[currentIndex] = newItem;
-        to.insertBefore(newItem, item);
+        self.insertBefore(newItem, item);
         currentIndex++;
       }
 
-      function remove(from) {
+      function remove() {
         var next = item.nextSibling;
-        if (item != from.pinnedItem_)
-          from.removeChild(item);
+        if (item != self.pinnedItem_)
+          self.removeChild(item);
         item = next;
       }
 
-      var currentIndex = firstIndex;
       for (var item = this.beforeFiller_.nextSibling;
            item != this.afterFiller_ && currentIndex < lastIndex;) {
         if (!this.isItem(item)) {
           item = item.nextSibling;
           continue;
         }
 
         var index = item.listIndex;
         if (cachedItems[index] != item || index < currentIndex) {
-          remove(this);
+          remove();
         } else if (index == currentIndex) {
           newCachedItems[currentIndex] = item;
           item = item.nextSibling;
           currentIndex++;
         } else {  // index > currentIndex
-          insert(this);
+          insert();
         }
       }
 
       while (item != this.afterFiller_) {
         if (this.isItem(item))
-          remove(this);
+          remove();
         else
           item = item.nextSibling;
       }
 
       if (this.pinnedItem_) {
         var index = this.pinnedItem_.listIndex;
         this.pinnedItem_.hidden = index < firstIndex || index >= lastIndex;
         newCachedItems[index] = this.pinnedItem_;
         if (index >= lastIndex)
           item = this.pinnedItem_;  // Insert new items before this one.
       }
 
       while (currentIndex < lastIndex)
-        insert(this);
+        insert();
     },
 
     /**
      * Ensures that all the item sizes in the list have been already cached.
      */
     ensureAllItemSizesInCache: function() {
       var measuringIndexes = [];
       var isElementAppended = [];
       for (var y = 0; y < this.dataModel.length; y++) {
         if (!this.cachedItemHeights_[y]) {
@@ skipping 56 matching lines @@
     },
 
     /**
      * Redraws the viewport.
      */
     redraw: function() {
       if (this.batchCount_ != 0)
         return;
 
       var dataModel = this.dataModel;
-      if (!dataModel) {
+      if (!dataModel || !this.autoExpands_ && this.clientHeight == 0) {
         this.cachedItems_ = {};
         this.firstIndex_ = 0;
         this.lastIndex_ = 0;
         this.remainingSpace_ = true;
         this.mergeItems(0, 0, {}, {});
         return;
       }
 
       // Save the previous positions before any manipulation of elements.
       var scrollTop = this.scrollTop;
@@ skipping 181 matching lines @@
    * because list items can contain controls that can be focused, and for some
    * purposes (e.g., styling), the list can still be conceptually focused at
    * that point even though it doesn't actually have the page focus.
    */
   cr.defineProperty(List, 'hasElementFocus', cr.PropertyKind.BOOL_ATTR);
 
   return {
     List: List
   };
 });