Le démarrage des outils pour les développeurs est désormais environ 13% plus rapide 🎉 (de 11,2 secondes à 10 secondes)
Résumé : Le résultat est obtenu en supprimant une sérialisation redondante.
Présentation
Lors du démarrage de DevTools, il doit effectuer des appels au moteur JavaScript V8.
Le mécanisme utilisé par Chromium pour envoyer des commandes DevTools à V8 (et pour l'IPC en général) s'appelle mojo
. Mes collègues Benedikt Meurer et Sigurd Schneider ont découvert une inefficacité en travaillant sur une autre tâche et ont eu l'idée d'améliorer le processus en supprimant deux étapes redondantes dans la manière dont ces messages sont envoyés et reçus.
Voyons comment fonctionne le mécanisme mojo
.
Mécanismes mojo
Il existe une commande mojo EvaluateScript
qui exécute la commande JS. Il sérialise l'ensemble de la commande JS, y compris le arguments
, dans une chaîne de code source JavaScript pouvant être eval()
. Comme vous pouvez l'imaginer, ces chaînes peuvent devenir très longues et coûteuses. Une fois la commande reçue par V8, ces chaînes de code JavaScript sont désérialisées avant d'être exécutées. Ce processus de sérialisation et de désérialisation pour chaque message génère une surcharge importante.
Benedikt Meurer a réalisé que la sérialisation et la désérialisation de arguments
sont assez coûteuses, et que les étapes "Sérialiser la commande JavaScript en chaîne JavaScript" et "Désérialiser la chaîne JavaScript" sont redondantes et peuvent être ignorées.
Détails techniques: RenderFrameHostImpl::ExecuteJavaScript
Comment nous avons amélioré
Nous avons introduit une autre méthode d'API mojo qui nous permet de transmettre directement le nom de l'objet, la méthode à appeler et la liste des arguments, au lieu d'avoir à créer la chaîne de code source JavaScript. Cela nous permet d'ignorer la sérialisation et la désérialisation, et de ne pas avoir à analyser le code JavaScript.
Pour en savoir plus sur l'implémentation de cette optimisation, consultez ces deux correctifs:
- CL 2431864: [devtools] Réduire les coûts liés aux performances de la distribution des messages dans le front-end
- CL 2442012: [devtools] Utiliser
ExecuteJavaScriptMethod
dans DevTools
Impact
Pour mesurer l'efficacité de la modification, nous avons effectué des mesures en comparant les révisions Chromium cb971089a058 et 4f213b39d581 (avant et après la modification).
Pour les deux révisions, nous avons exécuté le scénario suivant cinq fois:
- Enregistrer une trace à l'aide de
chrome://tracing
- Ouvrir les outils de développement dans les outils de développement
- Obtenez la trace
CrRendererMain
enregistrée et comparez les métriques spécifiques à V8.
D'après ces tests, les outils pour les développeurs s'ouvrent environ 13% plus rapidement (de 11,2 s à 10 s) avec l'optimisation.
Faits saillants, durées du processeur
Nom de la méthode | Non optimisé (ms) | Optimisé (ms) | Différences (ms) | Amélioration de la vitesse (%) |
Total | 11 213,19 | 9 953,99 | -1 259,20 | 12,65% |
v8.run | 499,67 | 3.61 | -496,06 | 12,65% |
V8.Execute | 1 654,87 | 1 349,61 | -305,25 | 3,07% |
v8.callFunction | 1 171,84 | 1 339,77 | 167,94 | -1,69% |
v8.compile | 133,93 | 3,56 | -130,37 | 1,31% |
Tableau comparatif des métriques de traçage complètes
Les outils pour les développeurs s'ouvrent et fonctionnent plus rapidement avec une utilisation du processeur réduite. 🎉
Télécharger les canaux de prévisualisation
Envisagez d'utiliser Chrome Canary, Dev ou Bêta comme navigateur de développement par défaut. Ces canaux de prévisualisation vous donnent accès aux dernières fonctionnalités de DevTools, vous permettent de tester les API de plate-forme Web de pointe et vous aident à détecter les problèmes sur votre site avant vos utilisateurs.
Contacter l'équipe des outils pour les développeurs Chrome
Utilisez les options suivantes pour discuter des nouvelles fonctionnalités, des mises à jour ou de tout autre élément lié aux outils pour les développeurs.
- Envoyez-nous vos commentaires et vos demandes de fonctionnalités sur crbug.com.
- Signalez un problème dans les outils de développement à l'aide de l'icône Plus d'options > Aide > Signaler un problème dans les outils de développement dans les outils de développement.
- Envoyez un tweet à @ChromeDevTools.
- Laissez des commentaires sur les vidéos YouTube sur les nouveautés des outils pour les développeurs ou sur les vidéos YouTube sur les conseils concernant les outils pour les développeurs.