Search code examples
reactjsreact-reduxredux-toolkit

what is the difference between Redux CombineReducers and Redux-toolkit ConfigureStore


import { configureStore } from "@reduxjs/toolkit";
import testSlice from "./testSlice";
import {combineReducers} from "redux";

const rootReducer = combineReducers({test: testSlice})
export const store = configureStore({
  reducer: rootReducer,
});

Which one is better? for performance and use purpose. Which is good to use?


Solution

  • They are totally different things.

    If the reducer option is an object of slice reducers, like { users: usersReducer, posts: postsReducer }, configureStore will automatically create the root reducer by passing this object to the Redux combineReducers utility. See source code

      if (typeof reducer === 'function') {
        rootReducer = reducer
      } else if (isPlainObject(reducer)) {
        rootReducer = combineReducers(reducer)
      } else {
        throw new Error(
          '"reducer" is a required argument, and must be a function or an object of functions that can be passed to combineReducers'
        )
      }
    

    RTK configureStore setup the redux store configuration, not only reducer, but also middlewares, dev tools, preloaded state, and enhancers.

    The Redux combineReducers helper function turns an object whose values are different reducing functions into a single reducing function