render-callback-pattern-example.js

const ActuallyUsedComponent = () => (
  <div>
    /* some layout and markup that doesn't depend on global state */
    <Connect mapStateToProps={mapStateToProps} mapPropsToActions={actions}>
      /* some markup where the props from connect are actually needed */
    </Connect>
    <Route
      path="..."
      component={() => (
        <div>
          /*
           * something that actually needs to be rendered for this path,
           * usually you just provide a reference to a component
           */
          <Intl>
            /* some markup that actually needs Intl */
          </Intl>

          <Connect mapStateToProps={mapStateToProps}>
            /*
             * Another place where connect is needed,
             * may be it even gets another state slice
             */
          </Connect>
        </div>
      )}
    />
  </div>
);