Search code examples
reactjsperformanceinternet-explorerinternet-explorer-11mutation-observers

Is there a way to improve MutationObserver performance in IE 11?

we're having issues rendering some graphs in a complex screen with a lot http calls.

In chrome and some new browsers works nicely, but in IE11 is blocking all the UI.

I'm not sure how to resolve this, would be really nice to implement like a web-worker with a render to string with this heavy components, but i'm not sure if its possible

Using last version of React + styled-components + axios + recharts(d3 wrapper)

Thanks in advance guys

enter image description here

Solution

  • Forgot to post what caused the bad performance on IE11.

    The problem was I was rendering via React portals a lot of popups and adding them to the DOM, probably (10-20 tooltips/popups), in modern browsers everything worked fine but in Internet explorer probably how it's renderered internally caused everything to go SUPER slowly.

    The solution was to not render this tooltips unless they were mouseOver/click.

    We were using this Tooltips https://github.com/timc1/postel, we ended up using them but creating a superior component that handles this logic.

    I hope this information it's useful for any future reader =)