MouseOver Studio

Numa aplicação web na qual estava mexendo junto a outros desenvolvedores existia uma funcionalidade que consistia em gerar uns relatórios a partir de uns funcionários selecionados. A lista de funcionários se encontrava num combo box de múltipla escolha, com uma opção na parte inferior para selecionar todos os elementos da mesma. Dependendo do cliente onde a aplicação esta rodando, a lista de funcionários pode ser bem grande (1000+) e a operação de selecionar todos pode demorar uns segundos se o browser for tão bom quanto o Internet Explorer

A operação de selecionar todos consistia em fazer um loop das options do select e marcar cada uma como “selected = true”. Tentando optimizar o processo um dos desenvolvedores lembro das épocas em que mexia com VB e sugeriu ocultar o select, fazer o loop e depois mostrar o select de novo. O resultado foi impressionante, o processo foi umas 20x mais rápido!

Segue o script e uma prova do mencionado. A função selectAll1() implementa o procedimento utilizado em primeira instância. Já a função selectAll2() implementa também o hack de ocultar a combo antes de fazer a operação. Nas duas funções e logado o tempo que demorou a operação.

function selectAll1() {
	var date = new Date();
	var options = document.getElementById("select").options;
	var optionsLength = options.length;
	for (var i = 0; i < optionsLength; i++) {
		options[i].selected = true;
	}
	log(1, new Date() - date);
}

function selectAll2() {
	var date = new Date();
	var select = document.getElementById("select");
	select.style.display = "none";
	var options = select.options;
	var optionsLength = options.length;
	for (var i = 0; i < optionsLength; i++) {
		options[i].selected = true;
	}
	select.style.display = "";
	log(2, new Date() - date);
}

function log(i, ms) {
	document.getElementById("console").innerHTML += "selectAll" + i +
			" : " + ms + "ms“;
}

No IE a função selectAll1 demorou em média 700ms, a diferença da função selectAll2 que foi executada em somente 30 segundos na média. No Firefox os resultados das duas funções não foram tão distantes. Demoraram em média 150ms e 140ms respectivamente.