Optimisation #2 Javascript : Réduction du nombre de variables globales

En créant un nouvel objet (et un seul!), on évite de créer pleins de variables globales.

On gagne donc en :

Propreté de code
Performance (très peu avec les navigateurs actuels)

Et surtout, on évite les conflits de noms avec d’autres applications, widgets et librairies!

BAD

[javascript]
var firstName = ‘Joey’;
var lastName = ‘Bronner’;
function sayHello() {

}
console.log(firstName);
[/javascript]

GOOD

[javascript]
var User = {
firstName : ‘Joey’,
lastName : ‘Bronner’,
sayHello : function() {

}
}
console.log(User.name);
[/javascript]

Optimisation #1 Javascript : Mise en cache de la longueur d’un array

Pour optimiser un peu plus son code Javascript (pour ceux qui n’appliquent pas encore cette astuce bien sûr), je vais partager une petite best practice lors de l’itération d’une boucle for.

La boucle for « normale » ressemble à ça…
BAD

[javascript]
var tab = [‘element1’, ‘element2’, ‘element3’];
for (var i= 0 ; i<tab.length ; i++) {
// le reste du code
}
[/javascript]

Dans le code ci-dessus on constate qu’à chaque itération, la taille du tableau (tab) est recalculée via la commande tab.length. Mauvais!
Le but est de calculer cette longueur qu’une seule fois :
GOOD

[javascript]
var tab = [‘element1’, ‘element2’, ‘element3’];
for (var i= 0, iLen = tab.length ; i<iLen ; i++) {
// le reste du code
}
[/javascript]

Dans le code ci-dessus, on constante donc que la longueur est calculée la première fois et qu’elle est ensuite stockée dans la variable iLen.

Remarque
Pour des tableaux avec seulement quelques éléments l’optimisation ne se fait pas ressentir mais quand on travaille sur des milliers de lignes c’est plutôt pas mal!