Comment ai-je accéléré une fonction Javascript en

Dans un projet récent, je suis tombé sur une fonction dont l'efficacité laissait à désirer. Cette fonction exécutait deux boucles de carte, trois filtres (chacun accompagné d'un include) et une carte supplémentaire avec une recherche intégrée, totalisant 12 itérations. Même si certaines de ces méthodes, comme les filtres, n'avaient pas besoin de parcourir l'ensemble du tableau, l'opération restait assez coûteuse, surtout pour de grandes quantités d'articles.

La complexité de cette fonction était O(n * m), ce qui pourrait rapidement devenir un problème à mesure que le projet évoluait.

J'ai donc décidé d'optimiser cette fonction. La première étape que j'ai prise a été de remplacer les deux tableaux de clés par un Set. En JavaScript, un Set est une structure qui stocke des données uniques et offre une vérification de présence beaucoup plus rapide qu'un tableau. Alors que la vérification d'un tableau a une complexité O(n), dans Set, c'est O(1). De plus, les performances de la méthode Set.has ne diminuent pas avec l'augmentation du nombre de données dans Set, contrairement à Array.includes.

Ce changement a déjà apporté une amélioration significative des filtres qui fonctionnaient sur les baies. Cependant, dans l’une des cartes, il y avait un Array.find() qui pouvait également être optimisé. En JavaScript, une Map est une liste indexée, tandis qu'Array.find effectue une recherche linéaire et peut être 2 100 à 12 000 fois plus lente que Map, selon les performances du processeur sur lequel le code est exécuté.

En remplaçant Array.find par Map.get dans l'une des boucles, j'ai pu réduire le nombre total d'itérations de 12 à 9. Même si une réduction de trois boucles peut ne pas sembler significative, la complexité de l'algorithme est devenue O(n m), et le temps d'exécution de la fonction a été réduit de 96 % !

Dans les tests effectués sur un Intel Core i7-10510U, l'exécution de la fonction avec des tableaux a pris 28 fois plus de temps que son exécution avec Map et Set, en utilisant des tableaux de 5 000 éléments : 191,19 ms à 6,80 ms.

Il convient de mentionner que, alors que l'algorithme original avec des tableaux avait une complexité O(n * m), le temps d'exécution augmentait de façon exponentielle avec le nombre d'éléments. Dans un scénario de développement logiciel, il est crucial de prendre en compte la croissance de l’entreprise et les limites des machines sur lesquelles le code sera exécuté. Par exemple, si les tableaux atteignaient 50 000 éléments, le temps d'exécution de l'algorithme d'origine serait de 13 585 ms, tandis que l'algorithme optimisé avec Set et Map ne prendrait que 135 ms. Dans ce cas, l'algorithme d'origine serait 100 fois plus lent, affichant une réduction de 99 % du temps d'exécution avec optimisation.

Conclusion

Compte tenu de la supériorité de vitesse de Set et Map par rapport à Array pour la récupération d'informations, le coût d'itération pour créer un Set ou une Map est justifié lorsqu'il est nécessaire de vérifier ces informations dans des itérations comme Array.filter ou Array.find.

Cependant, l'utilisation de Set peut ne pas toujours être viable en raison de certains inconvénients, tels que le manque d'ordre séquentiel, l'impossibilité d'accéder directement aux éléments par index et la restriction de ne pas stocker d'éléments en double.

Malgré ces limitations, dans de nombreuses situations, le remplacement des tableaux par Set ou Map peut apporter des avantages significatifs en termes de performances et d'efficacité.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!