Debounce calls to ProjectManager._renderTree.

This is a possible fix for #9851. In my tests, this can cause a
dramatic speed up when lots of filesystem changes cause the tree
to be continuously rerendered.

I chose 100ms as the debounce time because that seemed quick enough that
users will not be waiting for their actions to be reflected in the tree.

Author: dangoor

src/project/ProjectManager.js

@@ -605,6 +605,8 @@ define(function (require, exports, module) {
         return null;
     };
 
+    var _RENDER_DEBOUNCE_TIME = 100;
+
     /**
      * @private
      *
@@ -621,6 +623,8 @@ define(function (require, exports, module) {
         FileTreeView.render(fileTreeViewContainer, model._viewModel, projectRoot, actionCreator, forceRender, brackets.platform);
     };
 
+    _renderTree = _.debounce(_renderTree, _RENDER_DEBOUNCE_TIME);
+
     /**
      * @private
      *
@@ -1375,7 +1379,8 @@ define(function (require, exports, module) {
 
 
     // Private API helpful in testing
-    exports._actionCreator                 = actionCreator;
+    exports._actionCreator                = actionCreator;
+    exports._RENDER_DEBOUNCE_TIME         = _RENDER_DEBOUNCE_TIME;
 
     // Private API for use with SidebarView
     exports._setFileTreeSelectionWidth    = _setFileTreeSelectionWidth;

test/spec/ProjectManager-test.js

@@ -23,7 +23,7 @@
 
 
 /*jslint vars: true, plusplus: true, devel: true, browser: true, nomen: true, indent: 4, maxerr: 50 */
-/*global define, describe, it, expect, afterEach, waitsFor, runs, waitsForDone, beforeFirst, afterLast */
+/*global $, define, describe, it, expect, afterEach, waitsFor, runs, waitsForDone, beforeFirst, afterLast */
 
 define(function (require, exports, module) {
     "use strict";
@@ -367,6 +367,20 @@ define(function (require, exports, module) {
                     expect($selectedItem.text().trim()).toBe(name);
                 }
             }
+            
+            /**
+             * ProjectManager pauses between renders for performance reasons. For some tests,
+             * we'll need to wait for the next render.
+             */
+            function waitForRenderDebounce() {
+                runs(function () {
+                    var d = new $.Deferred();
+                    setTimeout(function () {
+                        d.resolve();
+                    }, ProjectManager._RENDER_DEBOUNCE_TIME);
+                    waitsForDone(d.promise());
+                });
+            }
 
             it("should deselect after opening file not rendered in tree", function () {
                 var promise,
@@ -377,12 +391,14 @@ define(function (require, exports, module) {
                     promise = CommandManager.execute(Commands.FILE_OPEN, { fullPath: exposedFile });
                     waitsForDone(promise);
                 });
+                waitForRenderDebounce();
                 runs(function () {
                     expectSelected(exposedFile);
 
                     promise = CommandManager.execute(Commands.FILE_OPEN, { fullPath: unexposedFile });
                     waitsForDone(promise);
                 });
+                waitForRenderDebounce();
                 runs(function () {
                     expectSelected(null);
                 });
@@ -429,6 +445,7 @@ define(function (require, exports, module) {
                     promise = CommandManager.execute(Commands.FILE_OPEN, { fullPath: initialFile });
                     waitsForDone(promise);
                 });
+                waitForRenderDebounce();
                 runs(function () {
                     expectSelected(initialFile);
                     toggleFolder(folder, true);     // open folder
@@ -437,13 +454,15 @@ define(function (require, exports, module) {
                     promise = CommandManager.execute(Commands.FILE_OPEN, { fullPath: fileInFolder });
                     waitsForDone(promise);
                 });
+                waitForRenderDebounce();
                 runs(function () {
                     expectSelected(fileInFolder);
                     toggleFolder(folder, false);    // close folder
                 });
                 runs(function () {
                     toggleFolder(folder, true);     // open folder again
                 });
+                waitForRenderDebounce();
                 runs(function () {
                     expectSelected(fileInFolder);
                     toggleFolder(folder, false);    // close folder
@@ -460,6 +479,7 @@ define(function (require, exports, module) {
                     promise = CommandManager.execute(Commands.FILE_OPEN, { fullPath: initialFile });
                     waitsForDone(promise);
                 });
+                waitForRenderDebounce();
                 runs(function () {
                     expectSelected(initialFile);
                     toggleFolder(folder, true);     // open folder
@@ -471,10 +491,12 @@ define(function (require, exports, module) {
                     promise = CommandManager.execute(Commands.FILE_OPEN, { fullPath: fileInFolder });
                     waitsForDone(promise);
                 });
+                waitForRenderDebounce();
                 runs(function () {
                     expectSelected(null);
                     toggleFolder(folder, true);     // open folder again
                 });
+                waitForRenderDebounce();
                 runs(function () {
                     expectSelected(fileInFolder);
                     toggleFolder(folder, false);    // close folder