Utilisation de données
Objectifs de formation
Une fois cette unité terminée, vous pourrez :
- Expliquer les avantages de l’optimisation de la récupération des données
- Décrire les avantages apporté par la mise en cache des données
Résolution de défis spécifiques relatifs aux performances
Les composants Web Lightning s’exécutent côté client, sur une page unique, où ils sont créés et détruits selon les besoins, aux côtés d’autres composants qui utilisent les mêmes données. Cela signifie que les composants Web Lightning peuvent poser aux développeurs des défis uniques en matière de performances. Discutons de l’impact de ces caractéristiques sur les performances et examinons les meilleures pratiques pouvant permettre d’optimiser les performances de vos composants Lightning.
Tout d’abord, abordons l’optimisation de la récupération et de la mise en cache des données.
Optimisation de la récupération des données
Un composant sans données n’est pas très utile. Avec les composants Web Lightning, plusieurs possibilités s’offrent à vous lors de la récupération de données à partir du serveur. Voici quelques façons d’optimiser les échanges avec le serveur.
- Utilisez Lightning Data Service ou les données mises en cache autant que possible.
- Avant d’appeler le serveur, assurez-vous qu’il n’y a pas d’autre possibilité pour obtenir les données.
- Le cas échéant, envisagez de transmettre des données entre les composants à l’aide d’attributs, d’événements ou de méthodes plutôt que de récupérer les mêmes données au sein de différents composants.
- Si plusieurs composants sur une page récupèrent les mêmes données, envisagez de créer un composant de service ne comportant aucun élément d’interface utilisateur et pouvant interroger les données une seule fois en vue de les transmettre à d’autres composants.
- Lorsque vous effectuez un appel au serveur, limitez les champs et les lignes de l’ensemble de résultats.
- Il faut SÉLECTIONNER uniquement les champs dont vous avez besoin.
- Définissez une LIMITE sur la requête, ne renvoyez pas un grand nombre de lignes à la fois.
- Implémentez la pagination lorsque les requêtes peuvent avoir de grands ensembles de résultats.
- Un chargement différé accédait occasionnellement aux données. Ne préchargez pas de données dont l’utilisateur n’aura peut-être jamais besoin. Placez les composants les moins consultés dans un onglet secondaire auquel l’utilisateur n’accédera peut-être pas.
- N’appelez pas le serveur pour filtrer ou trier des données dont vous disposez déjà côté client, sauf si vous travaillez avec des données paginées. Les tableaux JavaScript ont des fonctions intégrées permettant d’effectuer des tâches telles que trier, filtrer et rechercher des valeurs.
- Au lieu d’utiliser Apex, utilisez Lightning Data Service et l’API d’interface utilisateur pour récupérer des enregistrements, ainsi que des vues de liste, des métadonnées et des valeurs de liste de sélection.
- Lors de l’utilisation de l’adaptateur Wire
getRecord
(qui fait partie de l’API d’interface utilisateur), demandez uniquement les champs requis par le composant. Soyez explicite. Par exemple, si le composant requiert un seul champ, demandez uniquement ce champ.@wire(getRecord, { recordId:'$recordId', fields:['Contact.Name'] });
- Ne demandez pas d’enregistrement en fonction de présentations, sauf si vous avez absolument besoin de toutes ces données. Les présentations sont un ensemble de champs gérés par l’administrateur et peuvent changer à tout moment. Les présentations sont très coûteuses en ressources, car elles contiennent souvent des centaines de champs.
@wire(getRecord, { recordId:'$recordId', layoutTypes:['Full'] });
Amélioration de la mise en cache des données
La composition d’applications est un moyen puissant de créer des applications en assemblant des composants autonomes. Cependant, sans une bonne planification, le caractère autonome des composants que vous assemblez peut avoir un impact négatif sur les performances. Par exemple, si tous les composants que vous créez effectuent leurs propres appels isolés au serveur pour récupérer les données dont ils ont besoin, le nombre d’appels au serveur sera élevé. Il est plus efficace de passer un seul appel long que de passer plusieurs appels plus petits.
La mise en cache des données côté client améliore les performances en partageant les données entre les composants, ce qui réduit considérablement le nombre d’échanges avec le serveur. L’infrastructure Composants Web Lightning dispose de deux mécanismes intégrés pour la mise en cache côté client : Lightning Data Service et les méthodes Apex pouvant être mises en cache. Si aucune de ces solutions ne répond à vos besoins, vous pouvez également implémenter une solution de mise en cache personnalisée.
Lightning Data Service
Lightning Data Service propose une approche d’enregistrement gérée : vous n’avez pas à écrire la logique d’accès aux données Apex. Il gère également la sécurité pour vous en vérifiant l’accessibilité des enregistrements et des champs. L’infrastructure est responsable de la gestion des enregistrements. Cela inclut leur récupération sur le serveur lorsqu’ils font l’objet d’une requête pour la première fois, leur stockage dans un cache client très performant, leur partage entre tous les composants qui les demandent, ainsi que l’envoi des modifications au serveur et aux entrées de cache invalidées lorsque des données Salesforce dépendantes changent.
Si un autre composant nécessite par la suite des champs supplémentaires, ces champs sont chargés de manière transparente et ajoutés à l’enregistrement dans le cache. Contrairement aux actions stockables qui peuvent mettre en cache tout type de réponse renvoyée par une méthode Apex, Lightning Data Service met en cache de nombreux types de données de l’API d’interface utilisateur : des enregistrements, des schémas, des métadonnées, des métadonnées de présentation, des listes d’enregistrements, des métadonnées de liste, etc. Lightning Data Service améliore également la cohérence de l’interface utilisateur : lorsqu’un composant met à jour un enregistrement, tous les autres composants utilisant cet enregistrement sont avertis et, dans la plupart des cas, actualisés automatiquement.
Méthodes Apex pouvant être mises en cache
Si vous ne pouvez pas utiliser Lightning Data Service, utilisez Apex. Une méthode Apex pouvant être mise en cache est une action de serveur dont la réponse est stockée dans le cache client afin que les requêtes ultérieures portant sur la même méthode serveur avec le même ensemble d’arguments soient accessibles à partir de ce cache au lieu du serveur.
Les méthodes Apex pouvant être mises en cache vous permettent d’accéder aux données à l’aide d’une approche traditionnelle d’appel de procédure à distance (RPC). Vous implémentez une logique dans Apex que vous exposez en tant que méthode invocable à distance. Les méthodes Apex pouvant être mises en cache vous permettent de mettre pratiquement n’importe quel élément en cache, quels que soient les retours d’appel de la méthode serveur. La ligne directrice générale est de mettre en cache (marquer comme stockable) toute action idempotente et non mutée.
Il est facile de créer une méthode Apex pouvant être mise en cache. Annotez simplement vos méthodes Apex avec @AuraEnabled(cacheable=true)
.
Dans l’API version 55.0 et ses versions ultérieures, vous pouvez utiliser l’annotation @AuraEnabled(scope='global')
avec @AuraEnabled(cacheable=true)
pour permettre aux méthodes Apex d’être mises en cache dans un cache global.
@AuraEnabled(scope='global' cacheable=true) public static someObject getIceCream(String flavor) { // your code here }
Dans l’unité suivante, vous découvrirez l’approche consistant à afficher les données uniquement lorsque cela est nécessaire en utilisant la divulgation progressive et le rendu conditionnel.
Ressources
- Guide du développeur de composants Web Lightning : getRecord
- Guide du développeur de composants Web Lightning : getRecordUi
- Guide du développeur de composants Web Lightning : Directives relatives aux données
- Blog des développeurs : Modularizing Code in Lightning Components
- Trailhead : Composants Web Lightning et données Salesforce
- Blog des développeurs : Conception de pages Lightning destinées à une utilisation à grande échelle
- Guide du développeur de composants Web Lightning : Appeler une méthode Apex
- Guide du développeur Apex : Annotation AuraEnabled