He estado usando la pila React - Redux - Typecript por un tiempo y hasta ahora me encanta. Sin embargo, dado que soy bastante nuevo en Redux, me he estado preguntando sobre este tema en particular. @ ¿Despacha acciones de Redux (y thunks) consideró operaciones costosas y debería usarse con moderación, o debería usarse tanto como se usa setState?

Digamos que el estado de Redux tiene un único reductor que administra la información del usuario:

const initialState = {
  firstName: '',
  lastName: ''
}

Y para cambiar estos campos, digamos que tenemos acciones comosetFirstName, setLastName, etc ... solo por simplicidad.

Y digamos que en la Vista tengo un elemento de entrada enrender():

<input onChange={this.firstNameInputChangeListener} placeholder="First Name"/>

ConsiderandosetFirstName se ha asignado al componente:

export default connect(state => state, { setFirstName })(ThisComponent);

¿Es óptimo enviar una acción cada vez que hay un cambio en la entrada:

public firstNameInputChangeListener = (event) => {
  this.props.setFirstName(event.target.value);
}

O es mejor crear un estado de componente local, vincular el estado al escucha de cambios y solo enviar una acción cuando se envía el formulario:

public state = {
  firstName: this.props.firstName;
}

public firstNameInputChangeListener = (event) => {
  this.setState({ firstName: event.target.value });
}

public submitButtonListener = (event) => {
  this.props.setFirstName(this.state.firstName);
}

¿Qué piensan ustedes