Make resizing in Files.app more responsive.

chrome/browser/resources/file_manager/js/file_grid.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.
 
 'use strict';
 
 /**
  * FileGrid constructor.
  *
  * Represents grid for the Grid Vew in the File Manager.
@@ skipping 22 matching lines @@
   self.metadataCache_ = metadataCache;
 
   if (util.platform.newUI())
     ScrollBar.createVertical(self.parentNode, self);
 
   self.itemConstructor = function(entry) {
     var item = self.ownerDocument.createElement('LI');
     FileGrid.Item.decorate(item, entry, self);
     return item;
   };
+
+  self.relayoutAggregation_ =
+      new AsyncUtil.Aggregation(self.relayoutImmediately_.bind(self));
 };
 
 /**
  * Updates items to reflect metadata changes.
  * @param {string} type Type of metadata changed.
  * @param {Object<string, Object>} props Map from entry URLs to metadata props.
  */
 FileGrid.prototype.updateListItemsMetadata = function(type, props) {
   var boxes = this.querySelectorAll('.img-container');
   for (var i = 0; i < boxes.length; i++) {
     var box = boxes[i];
     var entry = this.dataModel.item(this.getListItemAncestor(box));
     if (!entry || !(entry.toURL() in props))
       continue;
 
     FileGrid.decorateThumbnailBox(box, entry, this.metadataCache_,
                                   ThumbnailLoader.FillMode.FIT);
   }
 };
 
 /**
  * Redraws the UI. Skips multiple consecutive calls.
  */
 FileGrid.prototype.relayout = function() {
-  if (this.resizeGridTimer_) {
-    clearTimeout(this.resizeGridTimer_);
-    this.resizeGridTimer_ = null;
-  }
-  this.resizeGridTimer_ = setTimeout(function() {
-    this.startBatchUpdates();
-    this.columns = 0;
-    this.redraw();
-    cr.dispatchSimpleEvent(this, 'relayout');
-    this.endBatchUpdates();
-    this.resizeGridTimer_ = null;
-  }.bind(this), 100);
+  this.relayoutAggregation_.run();
 };
 
 /**
+ * Redraws the UI immediately.
+ * @private
+ */
+FileGrid.prototype.relayoutImmediately_ = function() {
+  this.startBatchUpdates();
+  this.columns = 0;
+  this.redraw();
+  this.endBatchUpdates();
+  cr.dispatchSimpleEvent(this, 'relayout');
+};
+
+/**
  * Decorates thumbnail.
  * @param {HTMLElement} li List item.
  * @param {Entry} entry Entry to render a thumbnail for.
  * @param {MetadataCache} metadataCache To retrieve metadata.
  */
 FileGrid.decorateThumbnail = function(li, entry, metadataCache) {
   li.className = 'thumbnail-item';
   filelist.decorateListItem(li, entry, metadataCache);
 
   var frame = li.ownerDocument.createElement('div');
@@ skipping 105 matching lines @@
     checkBox.classList.add('white');
     var bottom = li.querySelector('.thumbnail-bottom');
     bottom.appendChild(checkBox);
     bottom.classList.add('show-checkbox');
   }
 
   // Override the default role 'listitem' to 'option' to match the parent's
   // role (listbox).
   li.setAttribute('role', 'option');
 };