perf: state changer will not actually call callbacks if state value has not changed

Author: kantord

src/state_handler.js

@@ -1,8 +1,20 @@
+import _ from 'lodash';
+
 const create_state_handler = () => {
   const state = {}
   let subscriptions = []
 
-  const handle_change = () => {
+  const update_state = (variable, value) => {
+    // Replace old state with new state, report if value has actually changed
+    const old_state = Object.assign({}, state)
+    state[variable] = value
+    if (_.isEqual(old_state, state)) return false
+    return true
+  }
+
+  const handle_change = (variable, value) => {
+    // Return early if state didn't actually change
+    if (!update_state(variable, value)) return
     const old_subscriptions = subscriptions.slice()
     subscriptions = []
     old_subscriptions.map(callback => callback(state_handler, callback))
@@ -12,13 +24,11 @@ const create_state_handler = () => {
     'get_state': () => state,
     'init_variable': (variable, value) => {
       if (state[variable] === undefined) {
-        state[variable] = value
-        handle_change()
+        handle_change(variable, value)
       }
     },
     'set_variable': (variable, value) => {
-      state[variable] = value
-      handle_change()
+      handle_change(variable, value)
     },
     'subscribe': (callback) => {
       subscriptions.push(callback)

src/state_handler.test.js

@@ -81,6 +81,17 @@ describe('state handler', () => {
       my_callback.should.be.calledWith(state_handler, my_callback)
     })
 
+    it(`callback should not be called when no actual change happens - ${method}`, () => {
+      const my_callback = sinon.spy()
+      const injector = require('inject-loader!./state_handler.js')
+      const state_handler = injector({
+          'lodash': {'isEqual': () => true}
+      }).default()
+      state_handler.subscribe(my_callback)
+      state_handler[method]('foo', 42)
+      my_callback.should.not.be.called()
+    })
+
     it(`callback should retrieve collect state - ${method}`, () => {
       let retrieved_state = null
       const my_callback = (handler) => {
@@ -112,7 +123,10 @@ describe('state handler', () => {
 
   it('callback should be called again with re-subscribe', () => {
     const my_callback = sinon.spy(function() {state_handler.subscribe(my_callback)})
-    const state_handler = create_state_handler()
+    const injector = require('inject-loader!./state_handler.js')
+    const state_handler = injector({
+        'lodash': {'isEqual': () => false}
+    }).default()
     state_handler.subscribe(my_callback)
     state_handler.set_variable('foo', 42)
     state_handler.set_variable('foo', 42)