InertiaJS gère la gestion de l'état dans les applications (SPAS) d'une seule page via une approche unique qui mélange le routage côté serveur avec le rendu côté client, éliminant le besoin d'un système de gestion d'état côté client séparé typique dans les spas traditionnels construits avec des frameworks comme React ou Vue seul. Voici une explication complète de la façon dont les inertiajs gèrent l'état, le maintien de la réactivité et des transitions en douceur dans un contexte de spa:
Inertiajs agit essentiellement comme une bibliothèque de routage côté client qui permet des visites de page sans nécessiter de recharges de page complète. Au lieu que le navigateur obtienne une page HTML complète sur chaque navigation, l'inertie intercepte le lien clique et récupére les réponses JSON à partir du serveur. Ces réponses contiennent le nom du composant de page ainsi que les données d'état (accessoires) de la page. Cette approche basée sur les données signifie que le serveur contrôle quel état ou des données est envoyé au client pour chaque page, qui utilise ensuite pour rendre et mettre à jour dynamiquement les parties nécessaires de l'interface, ce qui entraîne une expérience de spa fluide.
Le mécanisme de gestion de l'état principal tourne autour de la maintenance de «l'objet de page» actuel, qui inclut le composant à rendre et les accessoires à y passer. Le serveur génère cet objet de page avec les données d'état pertinentes pour une route donnée. Lorsque la navigation se produit, l'inertie effectue une demande XHR (AJAX) plutôt qu'un rechargement de page complète. Il reçoit le nouvel objet Page, le compare à celui actuel et met à jour l'avant en échangeant des composants et des accessoires en conséquence sans perdre l'état précédent, le cas échéant.
Pour préserver l'état à travers la navigation ou dans des cas comme la rétention d'entrée de formulaire, Inertia fournit une fonctionnalité appelée «UserMember». Cet utilitaire enregistre l'état des composants (souvent un état) à l'état de l'historique du navigateur, permettant aux utilisateurs de naviguer et de revenir sans perdre leur entrée. «Useremember» peut être appliqué à n'importe quel objet de données, et en donnant une clé unique, l'inertie sait quel état enregistré à restaurer lorsque l'utilisateur revisite cette page ou ce composant. Cela imite le comportement de l'état côté client mais le gère tout au long du cycle de vie de la navigation du spa.
Lorsque vous traitez avec des formulaires, Inertia propose un formulaire amélioré «UseForm» qui non seulement gère l'état de formulaire mais se souvient également automatiquement de l'état entre les visites de page, sauf si c'est explicitement effacé. Cela signifie que les utilisateurs ne perdent pas de données de formulaire sur la navigation, améliorant l'UX sans nécessiter de solutions d'état côté client complexes.
Inertia prend également en charge le partage de données globales sur les pages à l'aide d'accessoires partagés passés du serveur à chaque demande. Cela comprend des données telles que l'état d'authentification, les informations utilisateur ou les messages flash. Ces accessoires partagés sont automatiquement fusionnés dans les accessoires de chaque composant de page, garantissant un état cohérent et centralisé disponible dans l'application sans gestion manuelle supplémentaire.
Le protocole utilise l'inertie comprend également une fonction de versioning pour gérer la synchronisation des actifs des clients et du serveur, évitant les décalages d'état provoqués par des fichiers JavaScript ou CSS périmés. Lorsque le serveur détecte un changement de version, il force un rechargement complet pour réinitialiser l'état de l'application et charger les derniers actifs.
Étant donné que l'état de l'inertie est étroitement intégré aux routes et aux contrôleurs côté serveur, il encourage un modèle d'utilisation où la logique du serveur dicte la disponibilité des données et que le frontend consomme ces données de manière déclarative. Par conséquent, une grande partie de la complexité de gestion de l'État inhérente aux spas lourds du client, comme la gestion de la récupération et de la synchronisation des données asynchrones, est déchargée dans le cadre côté serveur. Cela conduit à un code client simplifié et à moins de passe-partout autour de la synchronisation d'état.
En résumé, Inertiajs gère l'état dans les spas par:
- Utilisation d'objets de page JSON envoyés à partir des routes de serveur pour représenter l'état actuel de la page.
- Intercepter la navigation pour récupérer des données JSON minimales plutôt que des pages HTML complètes.
- Rendre dynamiquement les composants côté client appropriés avec leurs accessoires sur chaque changement d'itinéraire.
- Fournir «Usemember» pour persister l'état des composants à travers les navigations via l'historique du navigateur.
- Utilisation des aides de formulaire spécialisés («useForm» pour gérer et se souvenir de l'état du formulaire.
- Autoriser les données de serveur partagées (accessoires partagés) pour un état global et cohérent dans tout le spa.
- Gestion des versions d'actifs pour maintenir le client et le serveur en synchronisation, en maintenant l'intégrité de l'état de l'application.
- Déchargement de la logique des entreprises et des données vers le côté du serveur, minimisant la complexité côté client.