title: React DnD performances with many drop targets
body: <p>I've spent days trying to understand why in some cases the drag'n drop (with React DnD) is so slow in my React app.</p>
  
  <p>To be more precise, the problem is not really when I'm dragging an element, but when I'm starting to drag it: I click and handle click on an element and move my cursor, and it can take up to 10 seconds before the element appears under my cursor. The dragging itself is a bit laggy but acceptable, it's not the problem here.</p>
  
  <p>I've finally found out that it becomes slower with the number of drop targets increasing. For example, I can have 50 components on screen, each of them being not one but two drop targets because I handle it as a "top drop target" and a "bottom drop target", so you can drop your element above or below it depending on where your cursor is. Just by removing one of these possibilities, the performances increased drastically.</p>
  
  <p>I guess this problem comes from the fact that when I start dragging, the DnD layer searches for all the components that are possible drop targets and... do things with them (with the connect.dropTarget() function).</p>
  
  <p>Is there a way of avoiding this, or is it the very reason why DnD works? Like, can I detect the drop targets when they are hovered, instead of loading them all when I start dragging an element? I'll still need to change their style when they are hovered for example.</p>
  
  <p>Btw, I'm still using the legacy decorator API, would the new hooks API improve the performances?</p>
  
  <p>Thanks.</p>