This lesson demonstrates that you can get a small performance gain by removing AJAX calls that feed into redux from the react/hooks lifecycle. In this video we see a 100ms reduction in the time it takes to initiate our AJAX call to load AJAX rates when we move it outside of useEffect and into our index.js file.

A thorough look at some of these patterns can be found here: https://redux.js.org/tutorials/essentials/part-5-async-logic

Documentation for all of the methods available on our redux store including dispatch and getState can be found here: https://redux.js.org/api/store/#store-methods-1

Note: If you want to keep the logic inside of the useEffect

Syntax:

const store = configureStore({ reducer: counterReducer })

const exampleThunkFunction = (dispatch, getState) => {
  const stateBefore = getState()
  dispatch(increment())
}

store.dispatch(exampleThunkFunction)
 

Dispatch async event for initial state can be done outside of component. Can do it in index.js file before rendering anything.