Emulating Flux/Redux "lite" (was: Anyone wanna help make a Meteor Redux package?)

react
16

You might be able to wrap a facade around the appState.set that uses a setTimeout of 0 to try and mitigate cascading renders. For the most part it shouldn’t be terribly un-performant rendering 4 times (as its just a virtual diff).

You may also be able to gather all of the data calls into one component higher up, then pass down the data for the spinner as props.

Also you could create a higher order function that creates a component and wraps yours for components that are only reading state (note last line and spinner comp lines):

const Spinner = React.createClass({
  getInitialState() {
    return { visible: false }
  },

  render() {
    if (!this.state.visible) {
      return false;
    }

    return (
      <div> [graphical spinner here] ({this.props.message}) </div>
    )
  },

  componentDidMount() {
    this.timer = setTimeout(() => {
      this.setState({visible: true});
    }, 1500);
  }
});

Spinner = connectAppState(Spinner, {message: 'spinnerMessage'});
MeteorFlux Flow