La concaténation de chaînes de caractères pose souvent des problèmes de performances.

Malheureusement, la language Javascript n’est pas exempt de ce problème. Cet article montre comment optimiser de façon non-négligable une application utilisant du Javascript.

En effet, Pavel Simavok a procédé à quelques tests de performance sur la concaténation de String en Javascript. Le résultat est terrifiant !

De plus en plus d’applications web sont basées sur le modèle Ajax. Elles construisent dynamiquement en Javascript l’interface HTML. Cette construction peut rapidement utiliser de nombreuses concaténations en boucle et/ou de façon cyclique[1]. Pour ne pas rebuter l’utilisateur par des temps de chargement ou rafraîchissement trop longs, il est impératif de faire attention sur la manière de réaliser ces concaténations.

Afin de résoudre ces problèmes de performance, l’auteur propose dans un premier temps d’utiliser des variables temporaires lorsque plusieurs boucles sont imbriquées pour construire une longue chaine de caractères. Mais c’est sa seconde solution qui est réellement intéressante : le buffer. Il recommande son utilisation et présente une implémentation d’un StringBuffer en Javascript.

Voici le code remanié[2] de la classe StringBuffer pour les personnes pressées :

function StringBuffer() {
	var buffer = ;
	this.append = function(str) {
		buffer.push(str);
		return this;
	}
	this.toString = function() {
		return buffer.join('');
	}
}

Pour utiliser cette classe, il suffit de faire :

var buf = new StringBuffer();
buf.append('hello').append(' ');
buf.append('world');
alert(buf.toString());

L’utilisation de cette classe peut améliorer les performances d’une application web utilisant massivement le Javascript. Il ne faut donc pas hésiter à l’utiliser !

Notes

[1] A cause des raffraichissements des élements présents sur la page

[2] C’est une petite mise en application de l’encaspulation en Javascript.