Com a melhoria do desempenho do navegador e a adoção constante da nova interface de programação HTML5, o volume de JavaScript nas páginas da web está aumentando gradualmente. No entanto, um programa mal escrito tem o potencial de quebrar o site inteiro, frustrar os usuários e afastar clientes em potencial.
Os desenvolvedores devem usar todas as ferramentas e técnicas que podem usar para melhorar a qualidade de seu código e estar confiantes de que toda execução é previsível. Este é um tópico no fundo do meu coração e trabalhei há anos para encontrar um conjunto de etapas a seguir durante o processo de desenvolvimento para garantir que apenas o código da mais alta qualidade possa ser publicado.
Basta seguir estas sete etapas para melhorar bastante a qualidade do seu projeto JavaScript. Com esse fluxo de trabalho, os erros serão reduzidos e muitas otimizações de processamento serão feitas, oferecendo aos usuários uma experiência agradável de navegação.
01. Código
Primeiro, chame o modo estrito do ECMAScript5 e uma declaração de "modo rigoroso" em sua função e use o modo de design deste módulo. No fechamento da função auto-executada, o uso de variáveis globais deve ser minimizado através do módulo de código independente da Sandbox e por meio de dependências externas para manter o módulo variável global claro e conciso. Use apenas biblioteca e estruturas estabelecidas, comprovadas, bem apresentadas e bem-cultivadas e mantenha suas funções em um pequeno valor, separando qualquer lógica de negócios ou dados das operações do módulo e de outro código da camada de visualização.
Larger projects with multiple developers should follow a set of established coding principles, such as Google's JavaScript style guide, and require stronger code management rules, including strict dependency management through a library such as RequireJS, using package management using asynchronous module definitions (AMD), using package management using Bower or Jam (client library management tool) to refer to specific versions of your dependency files, and adopting structural design patterns such as observer mode to facilitate Comunicação vagamente acoplada entre diferentes módulos de código. Essa também é uma idéia sábia: use um sistema de sistemas de repositório de código, como Git ou Subversão, para fazer backup de seu código na nuvem através de alguns serviços, como código -fonte ou feijão mágico, fornecer a capacidade de restaurar para versões anteriores e criar uma filial de código para projetos mais avançados para executar diferentes funções, mesclá -las antes de concluí -las.
02. Arquivo
Use formatos de bloco de anotação estruturada como Yuidoc ou JSDOC na funcionalidade do arquivo, para que qualquer desenvolvedor possa entender seu objetivo sem estudar seu código, o que pode reduzir os mal -entendidos. O uso da sintaxe do Markdown pode ter comentários e explicações mais ricos e longos. Use a ferramenta de linha de comando associada para gerar automaticamente um documento no site: com base nessas opiniões estruturais, é consistente com quaisquer modificações feitas em seu código.
03. Análise de faixa
Execute uma ferramenta de análise de código estático em seu código regularmente, como JSHINT ou JSLINT. Essas verificações sobre falhas de codificação conhecidas e possíveis erros, como esquecer de usar padrões rígidos ou referenciar variáveis não declaradas e suportes ou semicolons ausentes. Corrija quaisquer problemas com os controles da ferramenta para melhorar a qualidade do seu código. Tente definir opções padrão para a sua equipe de projeto para aprimorar os padrões de codificação, como recuar cada linha por espaços, onde colocar aparelhos encaracolados e usar cotações únicas ou duplas em todo o arquivo de código.
04. Teste
Um teste de unidade é uma das funções executadas por uma pequena função independente: execute uma das funções da base de código principal da sua entrada específica para confirmar que ele gera um valor esperado. Para aumentar sua confiança, o código gravará estruturas usadas como o esperado, como jasmim ou tráfico para cada teste de unidade funcional, usando parâmetros de entrada esperados e imprevistos. Mas não se esqueça dessas situações de borda!
Execute esses testes em vários navegadores em vários sistemas operacionais, permitindo que você acelere os testes em máquinas virtuais na nuvem em suas demandas, aproveitando esse serviço, como o Browserstack ou o molho Labs. Esses dois serviços fornecem uma API que permite que seus testes de unidade sejam executados automaticamente em vários navegadores ao mesmo tempo e, uma vez concluídos, eles alimentarão os resultados para você. Como bônus, se o seu código for armazenado no GitHub, você poderá fazer um navegador, uma ferramenta que executará automaticamente seus testes de unidade quando enviar seu código.
05. Medição
Ferramentas de cobertura de código, como a medida de Istambul, quais linhas de código são executadas quando o teste de unidade é executado em sua função, relatando -o como uma porcentagem do número total de linhas de código. A execução de uma ferramenta de cobertura de código em seus testes de unidade e a adição de testes adicionais pode aumentar sua pontuação de cobertura para 100%, oferecendo maior confiança no seu código.
A complexidade de uma função pode ser medida usando a métrica da complexidade de Hallstead: a equação estabelecida pelo cientista da computação Morris Hallstead na década de 1970. A complexidade de uma função é quantificada com base em loops, ramificações e chamadas de função que ela contém: a complexidade de uma função pode ser medida usando as medidas de complexidade do halstead. Quando essa pontuação complexa diminui, mais fácil é entender e manter essa função, reduzindo a possibilidade de erros. A visualização dos dados gerados das medidas da ferramenta de linha de comando e a complexidade do código JavaScript ajuda a determinar a funcionalidade que pode ser melhorada ao armazenar resultados anteriores, permitindo o rastreamento das melhorias da qualidade ao longo do tempo.
06. Automação
Use corredores de tarefas como Grunt para operar automaticamente o processo de compilação, análise, teste, cobertura e geração de relatórios de complexidade, que economiza tempo e esforço e aumenta suas chances de resolver quaisquer problemas de qualidade que surgirem. A maioria das ferramentas e estruturas de teste destacadas nesta postagem estão associadas ao Grunt, o que pode ajudá -lo a melhorar a qualidade do seu fluxo de trabalho e código sem precisar mover um dedo.
07. Lidar com exceções
Ao mesmo tempo, em algum momento, seu código terá um erro quando executar. Use a instrução "tente ... capturar" para lidar adequadamente com erros de tempo de execução e o impacto do comportamento limitador no seu site. Use um serviço de rede para registrar erros que ocorrem durante a execução. E use essas informações para adicionar novos testes de unidade para melhorar seu código e eliminar esses erros um por um.
Passos para o sucesso
Essas sete etapas me ajudam a criar parte do código de que mais me orgulho da minha carreira até agora. Eles também são uma boa base para o futuro. Em seu próprio projeto, prometemos usar essas etapas para produzir código JavaScript de alta qualidade, para que possamos trabalhar juntos para melhorar a rede e levar ao sucesso passo a passo.