MD Bookmarks: Batch updates to the UI when processing deletes and moves

chrome/browser/resources/md_bookmarks/api_listener.js

 // Copyright 2017 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.
 
 /**
  * @fileoverview Listener functions which translate events from the
  * chrome.bookmarks API into actions to modify the local page state.
  */
 
 cr.define('bookmarks.ApiListener', function() {
+
+  /** @type {?number} */
+  var timerHandle;
+
+  /**
+   * Batches UI updates so that no changes will be made to UI until the next
+   * task after the last call to this method. This is useful for listeners which
+   * can be called in a tight loop by UI actions.
+   */
+  function batchUIUpdates() {
+    if (timerHandle)
+      clearTimeout(timerHandle);
+    else
+      bookmarks.Store.getInstance().beginBatchUpdate();
+
+    timerHandle = setTimeout(function() {
+      bookmarks.Store.getInstance().endBatchUpdate();
+      timerHandle = null;
+    });
+  }
+
   /** @param {Action} action */
   function dispatch(action) {
     bookmarks.Store.getInstance().dispatch(action);
   }
 
   /**
    * @param {string} id
    * @param {{title: string, url: (string|undefined)}} changeInfo
    */
   function onBookmarkChanged(id, changeInfo) {
     dispatch(bookmarks.actions.editBookmark(id, changeInfo));
   }
 
   /**
    * @param {string} id
    * @param {BookmarkTreeNode} treeNode
    */
   function onBookmarkCreated(id, treeNode) {
+    batchUIUpdates();
     dispatch(bookmarks.actions.createBookmark(id, treeNode));
   }
 
   /**
    * @param {string} id
    * @param {{parentId: string, index: number}} removeInfo
    */
   function onBookmarkRemoved(id, removeInfo) {
+    batchUIUpdates();
     var nodes = bookmarks.Store.getInstance().data.nodes;
     dispatch(bookmarks.actions.removeBookmark(
         id, removeInfo.parentId, removeInfo.index, nodes));
   }
 
   /**
    * @param {string} id
    * @param {{
    *    parentId: string,
    *    index: number,
    *    oldParentId: string,
    *    oldIndex: number
    * }} moveInfo
    */
   function onBookmarkMoved(id, moveInfo) {
+    batchUIUpdates();
     dispatch(bookmarks.actions.moveBookmark(
         id, moveInfo.parentId, moveInfo.index, moveInfo.oldParentId,
         moveInfo.oldIndex));
   }
 
   /**
    * @param {string} id
    * @param {{childIds: !Array<string>}} reorderInfo
    */
   function onChildrenReordered(id, reorderInfo) {
@@ skipping 46 matching lines @@
 
     cr.sendWithPromise('getCanEditBookmarks').then(onCanEditBookmarksChanged);
     cr.addWebUIListener(
         'can-edit-bookmarks-changed', onCanEditBookmarksChanged);
   }
 
   return {
     init: init,
   };
 });