JavaScript Looper

P: Como você torna um loop rápido?

R: Faça o mínimo possível dentro do loop.

Esta não é a melhor maneira de escrever um loop (explicarei o motivo a seguir)

for (var i = 0; i < bigArray.length; i++) {
    doWork(bigArray[i]);
}

O padrão de loop típico acima executa estas etapas em cada iteração :

1. Pesquisa de propriedade ( bigArray.length)
2. Comparação de valor ( i < bigArray.length)
3. Comparação de valores da condição de controle (verdadeiro | falso)
4. Incremento numérico ( i++)
5. Pesquisa de item de matriz ( bigArray[i])
6. Chamada de função ( doWork(...))

Aqui está um padrão de loop aprimorado:

var i = bigArray.length;
while(i--) {
    doWork(bigArray[i]);
}

Ele executa apenas estas etapas em cada iteração:

1. Comparação de valores da condição de controle (verdadeiro | falso)
2. Decréscimo numérico ( )i--
3. Pesquisa de item de matriz ( )bigArray[i]
4. Chamada de função ( )doWork(...)

O padrão de design aprimorado tem estes benefícios:

• Combina a condição de controle com a operação de decremento.
• Minimiza as pesquisas de propriedade (observando o comprimento da matriz uma vez)
• É 50% a 60% mais rápido que a primeira versão!

É rápido, compacto e fácil de ler, uso sempre que posso (mas nem sempre é a melhor escolha pelo facto de rodar ao contrário).

Essas são “micro otimizações”, mas quando você precisa espremer até o último quadro por segundo, cada escolha que você faz acrescenta (especialmente em dispositivos móveis e navegadores mais antigos).

Respostas relacionadas:

javascript foreach