Performance: Many calls to ReactDOM.createPortal() can be slow, can createPortal() be delayed until opened?

[dxinteractive]

Hi, I love this hook! Works well in most cases for things like tooltips.

I've found that if many instances of this hook are created at once (.e.g 50 or more), they all immediately make their own ReactDOM portals, but all those calls to ReactDOM.createPortal() are quite slow and there is a noticeable lag. It got me thinking if there could be an option added to tell this hook to lazily create its ReactDOM portals, so they only get made when they are opened, and persist from then on?

Of course this option would only make sense when used with stateful usages of the hook, because the hook does not know whether its is being used in a stateful way or not.

Another option for me is to create a single tooltip and share that around. Sometimes this is the right solution, but a downside of this approach is that I'd need to have something with knowledge of a set of these hook instances, which can work but kind of goes against React's declarative nature. Letting components use this hook wherever and whenever they like would be my preference.

[alex-cory]

Hey! That means a lot!

I have ideas for a solution for this. I have a lot of ideas to improve this library, I've just been under heavy heavy deadlines over the last monthish. I will reply again to this asap. Bare with me in this time of craziness.

[dxinteractive]

Sounds good! No hurry. I'm using it to make a quick little library called react-floatybox if you're interested in seeing how the usage of the hook looks.

[alex-cory]

@dxinteractive nice work! I will 💯 take a deeper look 😊

[lucasruy]

👀