Условная отрисовка при React + Redux

Есть типичное SPA на react + redux. Внутри него есть несколько различных view. Redux-store представляет из себя огромную помойку.

Есть некая верхняя компонента MainView И у неё в рендере примерно следующее

render() {
  return (
    <div>
      <View1 />
      <View2 />
    </div>
  );
}

View1 и View2 отрисовываются условно и меняются друг с другом местами. Каждая view берет данные для себя из своего подхранилища: ну т.е.

store = {
  view1: {
    active: false,
    // ...
  },
  view2: {
    active: true,
    // ...
  }
}

В каждом таком подхранилище View* еще куча мусора (т.е. данных) которые обновляются довольно активно, чем вызывают постоянный перерендеринг компоненты.

А теперь вопрос, как лучше сделать условную отрисовку этих компонент? Вариант 1: взять значения active для обоих View* внутри MainView и сделать:

render() {
  return (
    <div>
      { isView1Active && <View1 /> }
      { isView2Active && <View2 /> }
    </div>
  );
}

Вариант 2: внутри каждой View* компоненты сделать

render() {
  { active } = this.props;

  if (!active) return null;

  //...
}

Какой вариант лучше? И почему?