Como acelerar o seu código JavaScript.
Reduzir a atividade em Loops
Loops são muitas vezes usadas na programação.
Cada instrução em um loop, incluindo o for declaração, é executado para cada iteração do loop.
Procurar declarações ou atribuições que podem ser colocados fora do loop.
Bad cupom:
for (i = 0; i < arr.length; i++) {
Melhor cupom:
l = arr.length;
for (i = 0; i < l; i++) {
O código ruim acessa a propriedade length de uma matriz cada vez que o loop é iterativo.
O código melhor acessa a propriedade de comprimento fora do loop, e faz com que o loop de execução mais rápida.
Reduzir DOM Acesso
Acessando o DOM HTML é muito lento, em comparação com outras instruções JavaScript.
Se você esperar para acessar um elemento DOM várias vezes, acessá-lo uma vez, e usá-lo como uma variável local:
Reduzir DOM Tamanho
Manter o número de elementos no HTML DOM pequena.
Esta será sempre melhorar o carregamento da página, e acelerar a renderização (exibição da página), especialmente em dispositivos menores.
Toda tentativa de procurar o DOM (como getElementsByTagName) beneficiarão de um DOM menor.
Evite Variáveis desnecessários
Não crie novas variáveis se você não planeja salvar valores.
Muitas vezes, você pode substituir um código como este:
var fullName = firstName + " " + lastName;
document.getElementById("demo").innerHTML = fullName;
Com isso:
document.getElementById("demo").innerHTML = firstName + " " + lastName
Atraso JavaScript Carregando
Colocando seus scripts na parte inferior do corpo da página, permite que o navegador carregar a página pela primeira vez.
Enquanto um script está baixando, o navegador não irá iniciar quaisquer outros downloads. Além disso todas as atividades de análise e renderização pode ser bloqueado.
A especificação HTTP define que os navegadores não deve baixar mais de dois componentes em paralelo.
Uma alternativa é usar defer="true" na tag script. O atributo defer especifica que o script deve ser executado após a página ter terminado a análise, mas ele só funciona para scripts externos.
Se possível, você pode adicionar seu script para a página de código, após o carregamento da página:
Exemplo
<script>
window.onload = downScripts;
function downScripts() {
var element = document.createElement("script");
element.src = "myScript.js";
document.body.appendChild(element);
}
</script>
Evite usar com
Evite usar o com palavras-chave. Ela tem um efeito negativo sobre a velocidade. Ele também atravanca escopos JavaScript.
O com palavra-chave não é permitido no modo estrito.