Mozilla's getting a new look. What do you think? https://mzl.la/brandsurvey

Bonnes pratiques pour la performance des extensions

Cet article nécessite une relecture technique. Voici comment vous pouvez aider.

Cet article nécessite une relecture rédactionnelle. Voici comment vous pouvez aider.

Cette traduction est incomplète. Aidez à traduire cet article depuis l'anglais.

Un des grands avantages de Firefox est son extrême extensibilité. Les extensions peuvent faire presque tout. Toutefois, il y a un revers à cela : des extensions mal écrites peuvent avoir des conséquences graves sur l'usage de la navigation, y compris sur la performance globale de Firefox. Cet article propose quelques bonnes pratiques et recommandations qui peuvent non seulement améliorer la performance et la vitesse de votre extension, mais aussi de Firefox lui-même.

Améliorer les performances du démarrage

Les extensions sont chargées et exécutées dès que s'ouvre une nouvelle fenêtre du navigateur. Cela signifie qu'à chaque fois qu'une fenêtre s'ouvre, votre extension peut avoir une incidence sur le temps qu'il faut à l'utilisateur pour visualiser le contenu qu'elle essaie d'afficher. Il y a plusieurs choses que vous pouvez faire pour réduire le temps que votre extension prend sur l'apparition du contenu souhaité par l'utilisateur.

Chargez seulement ce dont vous avez besoin quand vous avez besoin

Ne chargez pas des ressources lors du démarrage qui sont nécessaires seulement si l'utilisateur clique sur un bouton ou si une préférence donnée est permise quand elle ne doit pas l'être. Si votre extension dispose de caractéristiques qui ne s'exécutent que lorsque qu'un utilisateur s'est identifié à un service, ne chargez pas les ressources de ces caractéristiques avant que l'utilisateur ouvre réellement une session.

Utilisez les modules de code JavaScript

Vous pouvez créer vos modules de code javaScript en incorporant des ensembles de caractéristiques qui sont seulement nécessaires dans des circonstances spécifiques. Cela permet de charger de grandes parties nécessaires de votre extension à la volée, au lieu de charger tout d'une seule fois.

Bien que les modules JavaScript puissent être extrêmement utiles et offrir des avantages de performance significatifs, ils doivent être utilisés à bon escient. Le chargement des modules engage peu de coût, donc segmenter le code jusqu'à un degré inutile peut être contre-productif. Le code devrait être modulaire, à souhait, ce qui augmente la clarté et le chargement des morceaux importants ou coûteux de fragments de code, s'ils peuvent être différés d'une façon significative.

Différez tout ce que vous pouvez

La plupart des extensions ont un auditeur d'événements de chargement dans leur séquence principale qui exécute les fonctions de démarrage. Faites-en le moins possible à cet endroit. La fenêtre du navigateur est bloquée pendant que le gestionnaire de chargement de votre extension fonctionne, ainsi plus il tarde dans cette opération, plus Firefox semblera lent à l'utilisateur.

S'il y a quelque chose qui peut être fait, même en une fraction de seconde plus tard, vous pouvez utiliser les méthodes nsITimer ou window.setTimeout() pour planifier une exécution différée. Même un court report peut avoir un grand impact.

Conseils sur les performances générales

Évitez de créer des fuites de mémoire

Les fuites de mémoire exigent du ramasse-miette et du collecteur de cycle un travail plus intense qui peut de manière significative dégrader les performances.

Les compartiments zombie sont un type particulier de fuite mémoire que vous pouvez détecter avec un minimum d'effort. Consultez la page Compartiments zombie, particulièrement la section Vérification proactive des extensions.

Consultez les Causes classiques de fuites de mémoire dans les extensions afin d'éviter les compartiments zombie et d'autres genres de fuites.

Aussi bien que la recherche de ces types spécifiques de fuite, il vaut la peine de s'exercer sur les fonctionnalités de votre extension et d'examiner le contenu de la mémoire pour s'assurer de toute utilisation excessive. Par exemple, le bug 719601 de Firefox a indiqué un compartiment JavaScript « Système principal » contenant des centaines de Mo de mémoire, ce qui est beaucoup plus important qu'habituellement.

Évitez l'écriture de CSS lent

  • Lisez le guide Écriture de CSS efficace.
  • Rappelez-vous que n'importe quel sélecteur dans votre règle qui pourrait s'appairer avec beaucoup de nœuds différents est une source d'inefficacité, soit durant l'apparemment du sélecteur ou soit durant le traitement dynamique de mise à jour. C'est particulièrement déconseillé pour ce dernier si le sélecteur peut dynamiquement démarrer ou cesser s'appairement. Évitez les « :hover » excessifs comme la peste.

Évitez les auditeurs d'événements de mutation dans un DOM

Les auditeurs d'événements de mutation sont extrêmement consommateurs de temps, une fois ajoutés même brièvement à un document, ils nuisent de manière significative à sa performance.

Les événements de mutation sont officiellement obsolètes, et il existe denombreuses alternatives ; ils devraient donc être évités à tout prix.

Chargez les services en mode paresseux

Le module XPCOMUtils JavaScript fournit deux méthodes pour le chargement lent de ressources :

  • defineLazyGetter() définit une fonction sur un objet spécifié qui agit comme un getter et qui sera créée dès la première fois qu'elle est utilisée. Voir exemples.
  • defineLazyServiceGetter() définit une fonction sur un objet spécifié qui agit comme un getter pour un service. Le service s'active dés la première fois que l'on utilise. Look through the source par exemples.

Beaucoup de services communs sont déjà mis en cache pour vous dans Services.jsm.

Utilisez les entrées-sorties en asynchrone

Cela ne peut pas être suffisamment souligné : ne jamais faire d'entrées-sorties dans une tâche principale.

N'importe quel genre d'entrée-sortie dans un traitement principal, que ce soit l'entrée-sortie de disque ou de réseau, peut causer les questions sérieuses de réactivité de l'unité centrale.

  • Ne jamais utiliser XMLHttpRequests en synchrone.
  • NetUtils.jsm fournit des aides pour la lecture et la copie asynchrones des dossiers.
  • Ne jamais accéder en synchrone à une base de données SQLite. Utiliser l'API asynchrone à la place.
  • Effectuer des opérations séquentielles et asynchrones peuvent souvent être considérablement simplifiées en utilisant Promises.

Évitez les événements de mouvement de souris

Évitez utiliser les auditeurs d'événement de souris, y compris le mouseover, le mouseout, le mouseenter, le mouseexit, et particulièrement le mousemove. Ces événements se produisent avec la haute fréquence, ainsi leurs auditeurs peuvent trivialement créer des surcharges très élevés de l'unité centrale .

Quand ces événements ne peuvent pas être évités, pendant le calcul, les auditeurs devrait être maintenu à un minimum et à un travail réel restreint. Les auditeurs devraient être ajoutés à l'élément le plus spécifique possible, et être enlevés lorsqu'ils ne sont pas immédiatement nécessaires.

Évitez les images animées

Généralement les images animées sont beaucoup plus consommatrice de temps que prévues, particulièrement lorsqu'elles sont utilisées dans l'élément XUL tree.

Envisagez d'utiliser les exécuteurs du Chrome

Vous pouvez utiliser l'élément ChromeWorker pour exécuter des tâches de longue durée ou faire du traitement de données.

Consulter aussi

Étiquettes et contributeurs liés au document

 Contributeurs à cette page : Frigory, enguerran, tomcat_lechat
 Dernière mise à jour par : Frigory,