Quick tip: Bien utiliser Firebug pour optimiser et débugger son site
Publié par Gui dans Développement, Tips
Firebug est incontestablement l’outil indispensable pour tout développement web (si bien entendu, on utilise Firefox). Mais utilisez-vous toutes ses fonctionnalités ?
Je vous propose aujourd’hui de regarder de plus près la console de Firebug.
La console affiche toutes sortes d’informations utiles pour une page donnée qui peuvent être utilisées à différentes fins. Firebug n’étant disponible que sur Firefox, pensez à bien vérifier que la console peut être activée :
if (this.console && typeof console.log != "undefined")
Debuggage
Il est bien pratique d’ajouter un mode debug (comme l’option debugMode de jDiaporama) pour logger des actions et debugger une application javascript par exemple.
Grâce à la console de Firebug, nous disposons de différents outils pour bien gérer l’avancement d’un projet:
- Simple information (info)
- Avertissement (warn)
- Erreur (error)
Optimisation
Un autre outil bien pratique pour optimiser son code est la fonction console.time() qui fonctionne comme suit:
console.time("maBoucle"); for(i=0; i<1000; i++) { document.write("test"); } console.timeEnd("maBoucle");
Et qui donne comme résultat :
On peut ainsi facilement se rendre compte du temps d’éxécution de chaque fonction et voir le gain de temps procuré par les différentes optimisations du code.
A vos consoles, prêts ? partez !
1 commentaire
Laisser une réponse

Bonjour,
J’ai essayé sur ce plugin :
http://xavier-artot.com/blog/?p=142
$(document).ready(function() {
console.time(« dnd »);
$(‘#drop’).dnd({
dragBox:’#dragBox’
});
console.timeEnd(« dnd »);
});
Cela ne fonctionne pas