Le rendu côté client dans React.js est un processus par lequel le code JavaScript est envoyé au navigateur, qui aura la responsabilité de générer le HTML et de le rendre visible pour l’utilisateur. C’est l’opposé du rendu côté serveur où le HTML est généré sur le serveur et envoyé au navigateur.
Voici comment cela fonctionne:
1. Le navigateur fait une demande au serveur pour obtenir le fichier JavaScript.
1. Après avoir obtenu le fichier, le navigateur exécute le code JavaScript.
1. React crée un arbre de composants virtuels en utilisant le JavaScript reçu du serveur. C’est un modèle de l’interface utilisateur qui sera affichée.
1. React crée ensuite le DOM réel dans le navigateur en utilisant l’arbre de composants virtuels. C’est à ce stade que l’utilisateur commence à voir l’interface utilisateur.
1. Lorsqu’il y a des changements d’état ou des mises à jour dans l’application, React crée un nouvel arbre de composants virtuels.
1. React compare alors le nouvel arbre de composants virtuels avec l’ancien et détermine quels changements doivent être apportés au DOM réel.
1. Finalement, React met à jour uniquement les parties du DOM qui ont besoin de changer.
1. Ce processus se répète à chaque fois qu’il y a un changement dans l’état de l’application.
Cela rend les applications React très rapides et performantes car seulement une petite partie du DOM est modifiée en réponse aux changements d’état de l’application, au lieu de recharger tout le DOM à chaque fois.
