Boas práticas de programação são sempre bem-vindas em qualquer código. Infelizmente nem tudo pode ser aproveitado de uma linguagem para outra devido a forma como as mesmas são implementadas em seu “encanamento” para transformar o nosso código em imagens, animações, arquivos, etc…
Tendo isto em vista isto, coloquei aqui uma lista de boas práticas para programar em JavaScript que podem ajudar a melhorar o desempenho, eficiência e entendimento do seu código.
1) Evite usar variáveis globais
Sempre que possível, evite utilizar variáveis globais. Isso inclui todos os tipos de dados, objetos e funções pois eles podem ser sobrescritos por outras bibliotecas ou códigos espalhados pelo seu site/aplicativo. Outro possível problema é que a performance, apesar de pouco, é afetada negativamente pois demora mais tempo para o código ler as variáveis globais no JavaScript.
2) Utilização dos ponto-e-vírgulas
Teoricamente, a maioria dos interpretadores deveria permitir que os ponto-e-vírgulas sejam omitidos de certas partes do código (ex.: antes do fechamento das chaves e ao definir valores a variáveis). No entanto isso não é necessariamente uma regra e pode levar seu código executar de forma não desejada.
3) Nunca declare números, strings e booleanos como objetos.
Declarar variáveis de tipos “primitivos” como objetos causa um impacto na performance do código que é desnecessário em 99% das vezes que é feito desta forma. Sempre que possível declare-os utilizando os valores primitivos (ex.: var umaString = “teste”;).
4) JavaScript Puro Sempre Pode Ser Mais Rápido Que Usar Uma Biblioteca
Bibliotecas como o Jquery, bootstrap.js, w3.js entre outras são ótimas ferramentas para reduzir o tempo de desenvolvimento de aplicativos e websites. No entanto, elas pesaram para serem carregadas por seus usuários e as funções que elas fornecem podem ser significativamente mais lentas que a utilização do JavaScript puro. Por isso, avalie sempre a necessidade de utilização dela e também se ela seria substituível por algumas funções prontas da linguagem.
5) Coloque os Scripts na Parte Final da Sua Página
Algumas bibliotecas e frameworks já tem instruído os desenvolvedores, mas vale a pena lembrar. Sempre que possível, chame os scripts no final antes do </body>, pois desta forma você estará permitindo que o html e o css renderizem em tela antes de carregar os scripts. Isto dá uma sensação de velocidade maior para o usuário que dificilmente interagirá com seu site antes do binding de eventos e carregamentos das funções.
6) Minimize as chamadas HTTP
Cerca de 80% do tempo de resposta para o usuário final é gasto no front-end e boa parte deste tempo é baixando imagens, stylesheets, scripts, etc… É aconselhável que você entregue todo o código JavaScript de uma vez só e assim economizar a chamadas para cada arquivo. Para isso existem diversas ferramentas que permitem minificar e unir diversos arquivos JavaScript em um só. Verifique se sua IDE e linguagem de programação back-end possuem tal funcionalidade.
7) Deixe o código JavaScript em arquivos externos
Normalmente o uso de arquivos externos (colocar o código em um arquivo js ao invés da tag script dentro do html) gera uma página com tempo de carregamento mais rápido pois o navegador costuma fazer cache de arquivo JS e CSS. Se o estilo e o script do código existir junto com o HTML, ele será baixado junto com a página toda vez que a mesma for carregada. Por mais que essa prática reduza o número de chamadas http, ela aumenta o tempo base fixo para carregamento do website.
8) Minifique e use Gzip
Apesar da indentação e comentários serem ótimos para melhorar a leitura, entendimento e clareza do seu código, os interpretadores não precisam deles e na verdade precisam trabalhar mais para isso. Por isso, utilize uma ferramenta para criar uma cópia minificada do seu código javascript quando for colocá-lo em produção.
Outra ferramenta que pode reduzir o tamanho de seus arquivos em mais da metade é o gzip, reduzindo o tempo necessário para que o conteúdo seja baixado pelo usuário final.
9) Comente seu código
Essa última dica deveria ser cadeira de faculdade. O código comentado facilita muito a comunicação do que está (ou deveria estar) acontecendo no programa e permite que outros programadores possam navegar com menos trabalho em scripts que não são deles. Para aqueles que trabalham sozinhos e acreditam que não precisam comentar seu próprio código pois são os únicos que o lerão eu lhes pergunto, você já consegue pegar o código fonte de um programa complexo seu escrito 2 anos atrás e dizer de cara o que cada função faz?