Reconciliación es un término de React para la actualización selectiva del árbol de componentes para reflejar el nuevo estado o las nuevas propiedades de la aplicación. En lugar de recrear todo el árbol de componentes cada vez que ocurre un cambio, React es capaz de hacer un seguimiento de qué elementos han cambiado para actualizar solo esas partes del árbol de la forma más eficiente posible.
Este es el proceso básico de la reconciliación en React:
1. Cuando el estado de un componente cambia, React desencadena una serie de actualizaciones, incluyendo la fase de representación (o render), la cual genera un nuevo árbol de componentes React.
2. React compara este nuevo árbol de componentes con el árbol anterior (usando un algoritmo de dirección en profundidad, depth-first) para identificar qué partes del árbol han cambiado. Este paso se conoce como diffing.
3. Una vez que React ha identificado que los nodos del árbol han cambiado (por ejemplo, un componente tenía un elemento hijo antes pero ya no lo tiene, o un componente está renderizando un tipo de elemento diferente), hará las actualizaciones necesarias a la UI para que refleje exactamente el nuevo árbol de componentes. Este paso se conoce como mutaciones.
4. Finalmente, luego de aplicar las actualizaciones, el navegador tomará dichos cambios y efectivamente pintará la representación más reciente.
La reconciliación es uno de los aspectos más importantes de React porque la eficiencia de esta fase puede tener un impacto directo en el rendimiento de la aplicación entera. De hecho, la razón principal por la que React puede ser tan rápido es que es capaz de minimizar el trabajo hecho durante esta fase.
