Guaranteed Dispatch Sequence

Question

I’m trying to find something out about redux reducers but I think the terminology might be different since this is JavaScript.

Assuming the following reducer:

import {
  ONE,
  TWO,
  THREE
} from "../actions/types";

export default function reducer(state = { /* some init state here */ }, action) {
  switch (action.type) {
    case ONE: {
      // this case takes 500ms to finish
      return {...state }
    }
    case TWO: {
       // this case takes 200ms to finish
       return {...state }
    }
    case THREE: {
       // this case takes 100ms to finish
       return {...state }
    }
    default: {
       return {...state }
    }
};

If I did the following from an action:

dispatch({type: ONE});
dispatch({type: TWO});
dispatch({type: THREE});

are they guaranteed to resolve in that order? Meaning, is the state synchronized and “single threaded” ? Or would case TWO: {}, for example, fire before case ONE: {} completed?

Answer 1

dispatch is synchronous by default, so, as long as you don't have async calls in the action creator, they execute in the order they were declared.

In redux's docs it is implied that dispatch() is synchronous:

Action creators can also be asynchronous and have side-effects. You can read about async actions in the advanced tutorial to learn how to handle AJAX responses and compose action creators into async control flow.