Can I have multiple calls to ReactDOM.render() in a single JavaScript file?

Question

Can I have multiple calls to ReactDOM.render() in a single JavaScript file?

Answer

We can have multiple calls to ReactDOM.render() in a single JavaScript file without issue - having multiple calls to ReactDOM.render() may be especially useful when using React in an exisiting application/site. However, when we build an application using only React, we’ll usually use a single call to ReactDOM.render(), not multiple.

17 Likes

May i know why a single call ? Render all the thing at once to save the computer processing power ?

When the web was created, they consist of pages, that was it. Whoever created the page put content on the page(s), that was a website.

when you had to navigate to a different page, a whole new page page had to fetched, loaded and displayed.

slowly, this process became more dynamic. Databases where introduced (allowing for user content on a website), but still the entire page had to be refreshed to then fetch all post and display them.

Take this forum for example, the “old way” meant that after submitting my reply, the whole page needed to be refreshed to display all replies

Too speed up this process, wouldn’t it be much nicer if my reply was submitted, validated and then just appended to the page without a page refresh?

reactJS (and others) takes thing even further, we named it SPA (single page application). Its so dynamic, you only update what you need, there are never any page refreshes.

So render only need to be called a single time, from that point on-wards you can do everything dynamic with react.

4 Likes

wow , thank for the reply and explanation on this

1 Like

No questions about what i explained? Its quite a lot do digest.