Throttle updates to the internet details page.

chrome/browser/resources/options2/chromeos/internet_detail.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.
 
 cr.define('options.internet', function() {
   var OptionsPage = options.OptionsPage;
   /** @const */ var ArrayDataModel = cr.ui.ArrayDataModel;
 
+  /**
+   * Minimum delay in milliseconds before updating controls.  Used to
+   * consolidate update requests resulting from preference update
+   * notifications.
+   * @type {Number}
+   * @const
+   */
+  var minimumUpdateContentsDelay_ = 50;
+
+  /**
+   * Time of the last request to update controls in milliseconds.
+   * @type {Number}
+   */
+  var lastContentsUpdateRequest_ = 0;
+
+  /**
+   * Time of the last update to the controls in milliseconds.
+   * @type {Number}
+   */
+  var lastContentsUpdate_ = 0;
+
   /*
    * Helper function to set hidden attribute for elements matching a selector.
    * @param {string} selector CSS selector for extracting a list of elements.
    * @param {bool} hidden New hidden value.
    */
   function updateHidden(selector, hidden) {
     var elements = cr.doc.querySelectorAll(selector);
     for (var i = 0, el; el = elements[i]; i++) {
       el.hidden = hidden;
     }
   }
 
   /**
    * Monitor pref change of given element.
    * @param {Element} el Target element.
    */
   function observePrefsUI(el) {
     Preferences.getInstance().addEventListener(el.pref, handlePrefUpdate);
   }
 
   /**
    * UI pref change handler.
    * @param {Event} e The update event.
    */
   function handlePrefUpdate(e) {
-    DetailsInternetPage.getInstance().updateControls();
+    var now = new Date();
+    requestUpdateControls(now.getTime());
+  }
+
+  /**
+   * Throttles the frequency of updating controls to accelerate loading of the
+   * page.
+   * @param {Number} when Timestamp for the update request.
+   */
+  function requestUpdateControls(when) {
+    if (when < lastContentsUpdate_)
+      return;
+    var now = new Date();
+    var time = now.getTime();
+    if (!lastContentsUpdateRequest_)
+      lastContentsUpdateRequest_ = time;
+    var elapsed = time - lastContentsUpdateRequest_;
+    if (elapsed > minimumUpdateContentsDelay_) {
+      DetailsInternetPage.getInstance().updateControls();
+    } else {
+      setTimeout(function() {
+        requestUpdateControls(when);
+      }, minimumUpdateContentsDelay_);
+    }
+    lastContentsUpdateRequest_ = time;
   }
 
   /////////////////////////////////////////////////////////////////////////////
   // DetailsInternetPage class:
 
   /**
    * Encapsulated handling of ChromeOS internet details overlay page.
    * @constructor
    */
   function DetailsInternetPage() {
@@ skipping 222 matching lines @@
       for (var x = 0; x < selectedItems.length; x++) {
         $('ignored-host-list').removeException(selectedItems[x]);
       }
     },
 
     /**
      * Update details page controls.
      * @private
      */
     updateControls: function() {
+      // Record time of the update to throttle future updates.
+      var now = new Date();
+      lastContentsUpdate_ = now.getTime();
+
       // Only show ipconfig section if network is connected OR if nothing on
       // this device is connected. This is so that you can fix the ip configs
       // if you can't connect to any network.
       // TODO(chocobo): Once ipconfig is moved to flimflam service objects,
       //   we need to redo this logic to allow configuration of all networks.
       $('ipconfig-section').hidden = !this.connected && this.deviceConnected;
 
       // Network type related.
       updateHidden('#details-internet-page .cellular-details', !this.cellular);
       updateHidden('#details-internet-page .wifi-details', !this.wireless);
@@ skipping 561 matching lines @@
 
     // Don't show page name in address bar and in history to prevent people
     // navigate here by hand and solve issue with page session restore.
     OptionsPage.showPageByName('detailsInternetPage', false);
   };
 
   return {
     DetailsInternetPage: DetailsInternetPage
   };
 });