title: Will there be performance issues if there are multiple React roots (order of hundreds) on the same page?
body: <p>I'm building a marketing page and using a Wordpress-like CMS. As a result, most of the page's DOM will be server-side rendered. We have some interactive components on the page which we want to use React to build. Hence each interactive component will be its own React root and initialized with <code>ReactDOM.render()</code>.</p>
  
  <p>This is probably fine if I had one/two instances. The problem is I have a few hundred of them. Will this lead to performance issues if I call <code>ReactDOM.render()</code> hundreds of times on the same page? If so, what kind of issues? Startup time, interaction, page load time, etc?</p>
  
  <p>What other downsides to this approach are there?</p>
  
  <p>Some of the research I've done and read:</p>
  
  <ul>
  <li><a href="https://github.com/facebook/react/issues/12700" rel="nofollow noreferrer">https://github.com/facebook/react/issues/12700</a></li>
  <li><a href="https://stackoverflow.com/questions/31302803/is-it-ok-to-use-react-render-multiple-times-in-the-dom">Is it OK to use React.render() multiple times in the DOM?</a></li>
  </ul>