web-dev-qa-db-fra.com

Console.log va-t-il réduire les performances d'exécution de JavaScript?

L'utilisation de la fonctionnalité de débogage console.log réduira-t-elle les performances d'exécution de JavaScript? Cela affectera-t-il la vitesse d'exécution du script dans les environnements de production? 

Existe-t-il une approche pour désactiver les journaux de la console dans les environnements de production à partir d'un seul emplacement de configuration?

javascriptjqueryperformance
58
Sudantha

Si vous envisagez de placer ceci sur un site public ou quelque chose du genre, toute personne peu familiarisée avec l'utilisation des outils de développement peut lire vos messages de débogage. Selon ce que vous enregistrez, cela peut ne pas être un comportement souhaitable.

Une des meilleures approches consiste à insérer le console.log dans l’une de vos méthodes et à vérifier les conditions et à l’exécuter. Dans une version de production, vous pouvez éviter d'avoir ces fonctions. Cette question Stack Overflow explique en détail comment faire de même avec le compilateur Closure .

Alors, pour répondre à vos questions:

  1. Oui, cela réduira la vitesse, bien que négligeable.
  2. Mais ne l'utilisez pas, car il est trop facile pour une personne de lire vos journaux.
  3. Les réponses à à cette question peuvent vous donner des indices sur la façon de les retirer de la production.
43
Ramesh

En fait, console.log est beaucoup plus lent qu'une fonction vide. L'exécution de ce test jsPerf sur mon Chrome 38 donne des résultats stupéfiants:

  • lorsque la console du navigateur est fermée, appeler console.log équivaut à environ 10 000 fois plus lent que d'appeler une fonction vide,
  • et lorsque la console est ouverte, l'appel est jusqu'à 100 000 fois plus lent.

Cela ne signifie pas que vous remarquerez le décalage des performances si vous avez un nombre raisonnable d'appels console.… qui se déclenchent une fois (une centaine prendra 2 ms pour mon installation de Chrome - ou 20 ms lorsque la console est ouverte). Mais si vous enregistrez à plusieurs reprises des éléments sur la console - par exemple, en les connectant via requestAnimationFrame -, les choses peuvent devenir instables.

Mettre à jour:

Dans ce test J'ai également testé l'idée d'un "journal masqué" personnalisé pour la production - ayant une variable contenant les messages du journal, disponibles à la demande. Il s'avère être

  • environ 1 000 fois plus vite que le console.log natif,
  • et évidemment 10 000 fois plus vite si l'utilisateur a sa console ouverte.
54
tomekwi

Si vous créez un raccourci vers la console dans un script de base commun, par exemple:

var con = console;

puis utilisez con.log ("message") ou con.error ("message d'erreur") dans tout votre code. Lors de la production, vous pouvez simplement recâbler con dans l'emplacement principal pour:

var con = {
    log: function() {},
    error: function() {},
    debug: function() {}
}
8
sq2
const DEBUG = true / false
DEBUG && console.log('string')
6
Sergey Guns

Tout appel de fonction réduit légèrement les performances. Mais quelques console.log ne devraient pas avoir d’effet notable.

Cependant, il générera des erreurs non définies dans les anciens navigateurs qui ne prennent pas en charge console

4
Petah

Les performances seront minimes, mais dans les navigateurs plus anciens, cela provoquera des erreurs JavaScript si la console des navigateurs des utilisateurs n'est pas ouverte log is not a function of undefined. Cela signifie que tout le code JavaScript après l'appel de console.log ne sera pas exécuté.

Vous pouvez créer un wrapper pour vérifier si window.console est un objet valide, puis appeler console.log dans le wrapper. Quelque chose de simple comme ceci fonctionnerait:

window.log = (function(console) {
    var canLog = !!console;
    return function(txt) {
        if(canLog) console.log('log: ' + txt);
    };
})(window.console);

log('my message'); //log: my message

Voici un violon: http://jsfiddle.net/enDDV/

2
Paul

J'ai fait ce test jsPerf: http://jsperf.com/console-log1337

Cela ne semble pas prendre plus longtemps que les autres appels de fonction.

Qu'en est-il des navigateurs qui ne disposent pas d'une API de console? Si vous devez utiliser le fichier console.log pour le débogage, vous pouvez inclure un script dans votre déploiement de production pour remplacer l'API de la console, comme le suggère Paul dans sa réponse.

1
Jørgen

L'utilisation de la fonctionnalité de débogage console.log réduira-t-elle JavaScript performance d'exécution? Cela affectera-t-il la vitesse d'exécution du script dans environnements de production?

Bien entendu, console.log() réduira les performances de votre programme car cela prend du temps de calcul.

Existe-t-il une approche pour désactiver les journaux de la console en production environnements à partir d’un seul emplacement de configuration?

Placez ce code au début de votre script pour remplacer la fonction standard console.log par une fonction vide.

console.log = function () { };
0
holydragon