title: Redux mapStateToProps called multiple times
body: <p>I have this very simple Component, which is connected to redux state and returns <code>{fruit, vegetables}</code>. Everything works fine, but let's say I have a graph inside the Component and I if receive only updated <code>vegetable</code> from API the graph is being recreated each time.</p>
  
  <p>Here's my component:</p>
  
  <pre><code>const Products = ({ fruit, vegetable }) =&gt;
    &lt;div className='Products'&gt;
        &lt;div&gt;{vegetable.map(....logic here)}&lt;/div&gt;
        &lt;div&gt;{Math.random()}&lt;/div&gt; // this is to illustrate the component is rendering every time
        &lt;Graph&gt;Here will be a chart or a graph with fruit&lt;/Graph&gt; //but it gets re-rendered even though there is no new fruit
    &lt;/div&gt;
  
  const mapStateToProps = (state) =&gt; {
    return {
      fruit: state.data.fruit,
      vegetable:  state.data.vegetable,
    }
  }
  
  export default connect(mapStateToProps)(Products)
  </code></pre>
  
  <p>It seems to me that every-time, no matter which states is updated it re-renders the whole components.</p>
  
  <p>Is there a way to prevent that?</p>