title: Avoid re-rendering a big list of items with react-redux
body: <p>I am using redux with react and typescript for my application. I am working with many items used at different places of my app. My state looks like this:</p>
  
  <pre><code>{
      items: {42: {}, 53: {}, ... }, //A large dictionary of items
      itemPage1: {
          itemsId: [ 42, 34, 4 ],
          ...
      },
      itemPage2: { ... 
      },
      ...
  }
  </code></pre>
  
  <p>The user can modify some attributes of the <code>items</code> dispatching some actions. When this happen I need to redraw the components that have been modified in each pages. The issue is that my items are quite big and I cant afford to redraw all of them at each small modification. I was wondering is this approach would work:</p>
  
  <ul>
  <li>I have a fist component <code>&lt;ItemPage1&gt;</code> which connects to the store to get all of the states stored in the tree under <code>itemPage1</code> e.g. the list of items id: <code>itemsId</code>.</li>
  <li>Inside <code>&lt;ItemPage1&gt;</code>, I loop over the <code>itemsId</code> property to generate multiple <code>FilterItem</code> components: <code>itemsId.map( itemId =&gt; return &lt;FilterItem id=itemId&gt;);</code></li>
  <li><p>Finally each <code>Item</code> is connected using <code>ownProps</code> to get the correct part of the state:</p>
  
  <pre><code>const mapStateToItemProps = (state, ownProps) =&gt; {
      return {
          item: state.items[ownProps.id],
      }
  }
  const mapDispatchToItemProps = (dispatch, ownProps) =&gt; {
      return null;
  }
  const FilterItem = connect(
      mapStateToItemProps,
      mapDispatchToItemProps
  )(Item)
  </code></pre></li>
  </ul>
  
  <p>Can you confirm or refute that if I update the item of id 42, then only this item is going to be re-rendered ? </p>