Redux dev tools with redux-form

Question

I'm using redux with redux devtool I just tried redux-form: great job and funny to use! However, I guess that each time I modify a fied, the app state changed. redux devtool saves each new key tapped in a field. it slows field refreshes a lot!

Here is the the redux devtool dock panel that shows me app state changes:

Here is how I link redux-devtool to my app store:

const createStoreWithMiddleware = (() => {

  //DEv too only available in development 
    if (__DEV__ && window && window.location) {

    return compose(
      applyMiddleware(thunk),
      devTools.instrument(),
      persistState(
        window.location.href.match(/[?&]debug_session=([^&]+)\b/)
      )
    )(createStore);
  } else {
    return compose(
      applyMiddleware(thunk)
    )(createStore);
  }
})();


function configureStore(initialState) {
  const store = createStoreWithMiddleware(rootReducer, initialState);

  if (module.hot) {
    // Enable Webpack hot module replacement for reducers
    module.hot.accept("./reducers", () => {
      const nextReducer = require("./reducers");
      store.replaceReducer(nextReducer);
    });
  }
  return store;
}

var appStore = configureStore();
export default appStore;

I would like to find have a way to avoid getting redux dev tool pick up redux-form changes. Any better solution will be welcome :)

Answer 1

I think that redux-devtools-filter-actions is the elixir you seek. It was recommended in this thread complaining about redux-form verbosity.

Answer 2

You can go to Options of redux devtools extensions in your browser and there is a field, where you can specify actions which should be ignored. Type there 'redux-form/CHANGE' it this should work.