Throttle actions coming in from the VM

These aren't necessary to update in realtime, so throttle them to once every 30ms

package.json

@@ -53,6 +53,7 @@
     "react-redux": "5.0.2",
     "react-style-proptype": "2.0.1",
     "redux": "3.6.0",
+    "redux-throttle": "0.1.1",
     "scratch-audio": "latest",
     "scratch-blocks": "latest",
     "scratch-render": "latest",

src/index.jsx

@@ -1,7 +1,8 @@
 const React = require('react');
 const ReactDOM = require('react-dom');
 const {Provider} = require('react-redux');
-const {createStore} = require('redux');
+const {createStore, applyMiddleware} = require('redux');
+const throttle = require('redux-throttle').default;
 
 const GUI = require('./containers/gui.jsx');
 const log = require('./lib/log');
@@ -63,7 +64,9 @@ App.propTypes = {
 const appTarget = document.createElement('div');
 appTarget.className = styles.app;
 document.body.appendChild(appTarget);
-const store = createStore(
+const store = applyMiddleware(
+    throttle(300, {leading: true, trailing: true})
+)(createStore)(
     reducer,
     window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()
 );

src/reducers/targets.js

@@ -55,19 +55,28 @@ const reducer = function (state, action) {
 reducer.updateTarget = function (target) {
     return {
         type: UPDATE_TARGET,
-        target: target
+        target: target,
+        meta: {
+            throttle: 30
+        }
     };
 };
 reducer.updateTargets = function (targetList) {
     return {
         type: UPDATE_TARGET_LIST,
-        targets: targetList
+        targets: targetList,
+        meta: {
+            throttle: 30
+        }
     };
 };
 reducer.updateEditingTarget = function (editingTarget) {
     return {
         type: UPDATE_EDITING_TARGET,
-        target: editingTarget
+        target: editingTarget,
+        meta: {
+            throttle: 30
+        }
     };
 };
 module.exports = reducer;