issue #374 throttle calls to currentColorsService update function

src/js/service/CurrentColorsService.js

@@ -10,11 +10,16 @@
     this.cachedFrameProcessor = new pskl.model.frame.AsyncCachedFrameProcessor();
     this.cachedFrameProcessor.setFrameProcessor(this.getFrameColors_.bind(this));
 
+    this.throttledUpdateCurrentColors_ = pskl.utils.FunctionUtils.throttle(
+      this.updateCurrentColors_.bind(this),
+      1000
+    );
+
     this.paletteService = pskl.app.paletteService;
   };
 
   ns.CurrentColorsService.prototype.init = function () {
-    $.subscribe(Events.HISTORY_STATE_SAVED, this.updateCurrentColors_.bind(this));
+    $.subscribe(Events.HISTORY_STATE_SAVED, this.throttledUpdateCurrentColors_);
     $.subscribe(Events.HISTORY_STATE_LOADED, this.loadColorsFromCache_.bind(this));
   };
 

src/js/utils/FunctionUtils.js

@@ -2,6 +2,9 @@
   var ns = $.namespace('pskl.utils');
 
   ns.FunctionUtils = {
+    /**
+     * Returns a memoized version of the provided function.
+     */
     memo : function (fn, cache, scope) {
       var memoized = function () {
         var key = Array.prototype.join.call(arguments, '-');
@@ -11,6 +14,27 @@
         return cache[key];
       };
       return memoized;
+    },
+
+    /**
+     * Returns a throttled version of the provided method, that will be called at most
+     * every X milliseconds, where X is the provided interval.
+     */
+    throttle : function (fn, interval) {
+      var last, timer;
+      return function () {
+        var now = Date.now();
+        if (last && now < last + interval) {
+          clearTimeout(timer);
+          timer = setTimeout(function () {
+            last = now;
+            fn();
+          }, interval);
+        } else {
+          last = now;
+          fn();
+        }
+      };
     }
   };
 })();