I have about 100 editor instances on a single page. Profiling indicates that frequent calls to readSelectionRange are causing forced reflows, leading to significant performance degradation and jank.
Are there any recommended patterns or best practices to prevent this kind of layout thrashing when dealing with a large number of active editor instances?
This is only going to read the DOM layout though, and a reflow requires a read to happen after a write. Are you seeing multiple reflows caused by this for a single selection change?
Thanks for your reply.
I’m not very familiar with this subject, but I’ve recorded a performance profile, and it seems that the get anchorNode operation is causing a reflow.
I’m currently looking for a way to temporarily disable the domObserver. (I’ve tried lazy loading, but it has a negative impact on the user experience.)
It is, but if that’s a reflow that would happen anyway (which would generally be the case after a selection change), it’s not very meaningful to blame the specific code that happens to trigger it.