DEV Community

Understanding Rendering in React ♻ ⚛️

Mateo Garcia on January 31, 2021

Hey there! 👋🏼 I'm Mateo Garcia, I co-organize a community in Medellin, Colombia called React Medellin. This year I started a series of posts calle...

Read full post

supergentle • Feb 2 '21

I think the heuristic algorithm's time complexity drops to O(n) with some constraints. reactjs.org/docs/reconciliation.ht...

Mateo Garcia • Feb 6 '21

You're right 🤔

Adarsh Kumar Bhautoo • Feb 1 '21

Great article!

Mateo Garcia • Feb 1 '21

Thank you, Adarsh :)

vupadhayayx86 • Feb 2 '23

How Virtual DOM is mapped with Real DOM on the first Render? Isn't it time consuming to do all this conversion from JSX to JS and then create a virtual DOM and map it with the real DOM? I want to understand how initial render happens?

dthakur001 • Jan 31 '21

NICELY EXPLAINED!!!

Mateo Garcia • Jan 31 '21

Thank youu :)

Aral Roca • Jan 9 '22

I have the doubt if the new Virtual DOM is created after or before re-rendering. According to the order of the processes it seems that first is the Virtual DOM and then the re-render, but I always thought it was the other way around, because how do you know what new elements the new Virtual DOM will have without doing the re-render? Thank you.

Max • Feb 9 '21 • Edited

If anyone's interested, here's a more in-depth coverage of the process described in the article indepth.dev/posts/1008/inside-fibe...

Alexander Melnik • Feb 6 '21

Good job! Thank you for this article!)

Mateo Garcia • Feb 6 '21

Thank you, Alexander :)

Marrietta • Nov 13 '24

Hi,
I'm just trying to upload a simple design on to a tee on Fourthwall and a box comes up showing 0% and says "Initializing Rendering. This could take a few minutes. Do not close this window. " It has been at 0% for hours and I have no clue as to what rendering is. Extremely frustrating since this is the first design I am loading and I am trying to launch a business.