Redux Saga gère plusieurs tâches simultanées plus efficacement que Redux Thunk principalement en raison de son utilisation des fonctions du générateur ES6 et de sa conception pour gérer les flux asynchrones complexes de manière déclarative. Dans Redux Saga, les fonctions du générateur créent des «sagas», des processus d'arrière-plan à longue durée de vie qui peuvent faire une pause et reprendre, permettant un contrôle sophistiqué sur les opérations asynchrones, y compris la concurrence, l'annulation, le débouchement, l'accélérateur et les conditions de course. Cette capacité offre un moyen structuré et évolutif de gérer les effets secondaires, en particulier dans des applications complexes avec de nombreuses tâches asynchrones simultanées.
Redux Thunk, en revanche, est basé sur un concept plus simple qui implique des fonctions de retour des créateurs d'action au lieu d'objets d'action simple. Ces fonctions peuvent gérer les opérations asynchrones comme les appels d'API en envoyant différentes actions avant et après la fin de la tâche. Bien qu'il soit efficace pour les besoins asynchronisés simples ou modérément complexes, Redux Thunk manque de constructions intégrées pour gérer le contrôle de la concurrence et l'orchestration à effet secondaire, ce qui peut conduire à plus de chauffeur, du code plus difficile à maintenir lorsqu'il s'agit de nombreuses tâches asynchrones qui se chevauchent.
Fonctions du générateur pour le contrôle asynchrone
Redux Saga exploite les fonctions du générateur ES6, qui peuvent rendre le contrôle au middleware et attendre que les opérations asynchrones se terminent avant la reprise. Ce modèle de pause et de résumé permet aux sagas d'orchestrer plusieurs tâches simultanément et en parallèle avec un grand contrôle. Par exemple, les sagas peuvent déborder plusieurs tâches qui s'exécutent indépendamment, tandis que la saga principale continue l'exécution. Ils peuvent également courir les tâches, ce qui signifie qu'une tâche peut annuler les autres en fonction de celles qui se termine en premier.
Cette caractéristique contraste avec l'approche de Redux Thunk, où les fonctions asynchrones peuvent s'exécuter mais ne se prêtent pas naturellement à une telle coordination des tâches à grain fin. Les Thunks impliquent généralement des promesses et des rappels de nidification ou de chaînage, qui peuvent devenir complexes et lourds avec de multiples interactions simultanées.
Gestion de l'effet secondaire déclaratif
Redux Saga utilise des effets déclaratifs à travers un ensemble de créateurs d'effets intégrés tels que «TakeeVevery», «Takelatest», «Fork», «Call» et «Put». Ces effets génèrent des objets simples décrivant les effets secondaires, que le middleware interprète pour effectuer les opérations réelles. Parce que les sagas décrivent "quoi faire" plutôt que "comment le faire", le code est plus lisible et testable.
Pour la concurrence, «Fork» permet aux sagas de démarrer plusieurs tâches non bloquantes en parallèle. Par exemple, une saga peut déborder plusieurs observateurs pour écouter simultanément différentes actions ou effectuer plusieurs appels d'API à la fois. «TakeEvery» gère une saga pour chaque action dépêchée, gérant plusieurs actions simultanément sans bloquer la saga principale.
En revanche, Redux Thunk est impératif plutôt que déclaratif. Les créateurs d'action gèrent explicitement la logique asynchrone avec des conditions et plusieurs appels de répartition. La gestion de la concurrence est manuelle, entraînant souvent des rappels ou des promesses imbriqués complexes, affectant la maintenabilité et la clarté.
Gestion des flux complexes et annulation de la tâche
Redux Saga prend en charge des workflows asynchrones plus complexes au-delà des simples appels d'API, tels que le sondage de fond, le débouchement, les tentatives, les annulations et les actions de séquençage conditionnellement. Par exemple, les sagas peuvent annuler les tâches en cours lorsque certaines actions se produisent, empêchant les opérations obsolètes ou inutiles de terminer. Cette annulation est cruciale dans des scénarios simultanés comme la recherche de saisie semi-automatique où la nouvelle entrée utilisateur interdit les appels API précédents.
Redux Thunk manque de capacités d'annulation intégrées et s'appuie sur des bibliothèques externes ou une logique personnalisée pour obtenir des effets similaires. Cette limitation peut entraîner des conditions de course et une logique asynchrone plus dure à gérer à mesure que la complexité de l'application augmente.
testabilité et séparation des préoccupations
Étant donné que les fonctions du générateur de Redux Saga donnent des effets descriptifs, ils sont plus faciles à tester sans exécuter des opérations asynchrones réelles. Les développeurs peuvent tester la logique de la saga en affirmant la séquence et le contenu des effets donnés, sans avoir besoin de se moquer de l'environnement asynchrone.
Les tests redux thunk impliquent généralement une moquerie du magasin Redux et affirmer des actions réparties après la résolution de la promesse, qui teste les résultats asynchrones mais pas le contrôle de l'écoulement dans le thunk lui-même.
De plus, Redux Saga déplace la logique des effets secondaires hors des composants et des créateurs d'action en sagas, favorisant une meilleure séparation des préoccupations. Cette approche modulaire simplifie les opérations asynchrones de l'échelle multi-tâches dans des applications plus grandes.
Considérations de performance
Alors que Redux Thunk peut introduire moins de frais généraux pour les flux asynchrones simples en raison de sa nature légère, l'efficacité de Redux Saga dans la gestion de plusieurs tâches simultanées réduit la complexité et les bogues potentiels dans des applications plus grandes et plus exigeantes. En organisant des tâches simultanées de manière déclarative et en les gérant via un middleware de Saga centralisé, Redux Saga optimise la manipulation des opérations parallèles et la gestion des effets secondaires.
Résumé
- Redux Saga utilise les fonctions du générateur pour faire une pause et reprendre l'exécution des tâches, permettant un contrôle précis sur les tâches simultanées et parallèles.
- La nature déclarative des effets de Redux Saga («Fork», «Call», «TakeeVevery», etc.) lui permet de gérer plus naturellement des workflows asynchrones complexes tels que les tentatives, les annulations et le parallélisme.
- Il fournit des outils de gestion de concurrence intégrés comme «Fork» pour les tâches parallèles et les capacités d'annulation, qui redux thunk manque par défaut.
- Les fonctions du générateur pur de Redux Saga améliorent la testabilité en facilitant affirmer les effets donnés, tandis que les tests redux thunk nécessitent des dépêches moqueurs.
- Redux Saga favorise une meilleure organisation de code et la séparation des préoccupations en isolant les effets secondaires dans les sagas plutôt que de les mélanger avec des créateurs d'action ou des composants.
- Redux Thunk est mieux adapté aux opérations asynchrones séquentielles plus simples, tandis que la saga redux excelle dans la gestion des effets secondaires multiples, simultanés et complexes dans des applications évolutives.