A taxa de erros de JavaScript mede a porcentagem do aplicativo do seu navegador que apresenta erros de JavaScript, que podem interromper a funcionalidade do usuário e criar uma experiência ruim do usuário. Esta regra do scorecard ajuda você a identificar e priorizar a correção de problemas de front-end que afetam diretamente a satisfação dos clientes.
Sobre esta regra do scorecard
Esta regra de taxa de erros do JavaScript faz parte do Nível 1 (Reativo) no modelo de maturidade da experiência digital. Ele avalia se o aplicativo do seu navegador possui erros de JavaScript não resolvidos que podem estar afetando o usuário.
Por que isso é importante: Erros de JavaScript podem interromper funcionalidades críticas do usuário, como formulários, navegação, pagamentos ou recursos interativos. Usuários que encontram funcionalidades quebradas geralmente abandonam tarefas, o que leva à perda de conversões e à percepção negativa da marca.
Como funciona esta regra
Esta regra avalia a porcentagem de entidades do navegador (aplicativo monitorado pelo New Relic Browser) que apresentam erros de JavaScript. Ele identifica o aplicativo onde o usuário pode estar enfrentando problemas de funcionalidade devido a problemas no código do frontend.
Compreendendo sua pontuação
- Aprovado (Verde): Baixa porcentagem de aplicativos de navegador apresentam erros de JavaScript afetando o usuário
- Falha (Vermelho): Alta porcentagem de aplicativos de navegador apresentam erros de JavaScript não resolvidos
- Alvo: Minimize erros de JavaScript em todos os aplicativos do navegador, especialmente aqueles com alto tráfego de usuários
O que isto significa:
- Pontuação para aprovação: seu aplicativo front-end fornece uma experiência do usuário confiável com o mínimo de funcionalidade quebrada
- Pontuação baixa: o usuário pode estar encontrando recursos, formulários ou interações quebrados que podem afetar a satisfação e as conversões
Como reduzir taxas de erros de JavaScript
Se sua pontuação mostrar altas taxas de erros de JavaScript, siga estas etapas para identificar e resolver problemas de frontend:
1. Analise os padrões de erro na Caixa de entrada de erros
- Caixa de entrada de erros de acesso: navegue até a caixa de entrada de erros do New Relic para ver todos os erros de JavaScript em seu aplicativo
- Identificar erros de alto impacto: Concentre-se nos erros que afetam as jornadas mais críticas do usuário
- Agrupe erros semelhantes: procure padrões em mensagens de erro, páginas afetadas ou segmentos de usuário
- Priorize por impacto comercial: resolva primeiro os erros em páginas de alto tráfego ou fluxos críticos para conversão.
2. Categorizar e triar erros
Erros críticos (corrija imediatamente):
- Falhas no processamento de pagamentos
- Problemas de autenticação do usuário
- Problemas de envio de dados
- Falhas de navegação ou roteamento
Erros de alta prioridade (correção dentro do sprint):
- Falhas na validação do formulário
- Problemas de funcionalidade de pesquisa
- Problemas de interação do usuário
- Falhas no carregamento de conteúdo
Erros de média prioridade (correção em versões futuras):
- Pequenas falhas na interface do usuário
- Falhas de recurso não críticas
- Problemas estéticos ou de estilo
- Cenários extremos
3. Implementar resolução sistemática de erros
Reproduzir e diagnosticar:
- Use o rastreamento stack : examine os detalhes do erro para entender qual código está falhando
- Verifique a compatibilidade do navegador: verifique se os erros não são problemas específicos do navegador
- Cenários de teste de usuário: reproduzem as ações do usuário que acionam erros
- Revisar implantação recente: verificar se os erros estão correlacionados com alterações recentes no código
Corrigir as causas raiz:
- Verificações nulas/indefinidas: adicione tratamento de erro adequado para dados ausentes
- Tratamento de errosAPI : implementar fallbacks harmoniosos para requestsde rede com falha
- validação de entrada: garante que os formulários tratem de casos extremos e entradas inválidas
- Carregamento de recursos: adicionar tratamento de erros para imagens, scripts ou folhas de estilo ausentes
4. Estabelecer práticas de prevenção de erros
Implementar melhor tratamento de erros:
- Blocos try-catch: envolva operações arriscadas no tratamento de erros adequado
- Valores padrão: fornecer alternativas para dados ausentes ou inválidos
- Degradação elegante: garanta que a funcionalidade principal funcione mesmo quando o recurso falhar
- Mensagens amigáveis ao usuário: exibem mensagens de erro úteis em vez de detalhes técnicos
Melhorar as práticas de desenvolvimento:
- Revisão de código: Foco no tratamento de erros durante revisões por pares
- Estratégias de teste: Incluir cenários de erro em testes unitários e de integração
- Ambiente de preparação: teste exaustivamente antes dos lançamentos de produção
- Monitoramento integração: Adicionar monitoramento de erros aos ambientes de desenvolvimento e preparação
Medindo a melhoria
Acompanhe essas métricas para verificar seus esforços de redução de erros de JavaScript:
- Redução da taxa de erros: Diminuindo a porcentagem de aplicativos com erros de JavaScript
- Métrica de impacto do usuário: Taxa de conversão melhorada, taxas de rejeição reduzidas, maior satisfação do usuário
- Tempo de resolução de erros: identificação e correção mais rápidas de problemas de JavaScript
- Recorrência de erros: Menos erros repetidos após a implantação das correções
Cenários comuns de erros de JavaScript
Falhas de script de terceiros:
- Problema: Biblioteca ou widget externo causam erros quando não carregam ou apresentam problemas
- Solução: Implementar limites de erro, usar fallbacks e monitorar dependências de terceiros
Problemas de compatibilidade Browser :
- Problema: O código funciona em alguns navegadores, mas falha em outros
- Solução: Teste em vários navegadores, use polyfills e implemente aprimoramento progressivo
Falhas de rede e API:
- Problema: Erros de JavaScript quando requests de rede falham ou retornam dados inesperados
- Solução: Adicionar tratamento de erro adequado para chamada de API, implementar lógica de repetição e fornecer feedback ao usuário
Casos extremos de entrada do usuário:
- Problema: Formas ou interação rompem com entradas inesperadas do usuário
- Solução: Implementar validação abrangente de entrada e limpeza
Estratégias avançadas de gerenciamento de erros
monitoramento de automação de erros
- Alertas automatizados: configure alertas para erros de JavaScript novos ou frequentes
- Agrupamento de erros: Use agrupamento inteligente para evitar excesso de alertas
- Pontuação de impacto: priorize erros com base no impacto e na frequência do usuário
integração com fluxos de trabalho de desenvolvimento
- Integração CI/CD: Bloquear implantação caso sejam detectados erros críticos
- Orçamentos de desempenho: Definir limites de taxas de erros como portões de implantação
- Atribuição de erros: Conectar erros a lançamentos específicos de implantação ou recurso
Foco na experiência do usuário
- Monitoramento de usuário real: Rastreie como os erros afetam o comportamento real do usuário
- Impacto da conversão: avalie como as taxas de erros se correlacionam com as métricas de negócios
- Análise da jornada do usuário: Entenda onde no fluxo do usuário os erros ocorrem com mais frequência
Considerações importantes
- Priorize por impacto no usuário: concentre-se primeiro nos erros que afetam as funções comerciais mais críticas ou de uso.
- Equilibre a perfeição com a praticidade: alguns erros podem ser aceitáveis se não impactarem significativamente a experiência do usuário
- Considere o contexto empresarial: aplicativos de alto tráfego podem exigir menor tolerância a erros do que ferramentas internas
- Monitore a pós-implantação: garanta que as correções não introduzam novos erros
Próximos passos
- Ação imediata: Revise a caixa de entrada de erros e identifique os erros de JavaScript de maior impacto que afetam o usuário
- Melhoria de processos: Estabelecer reuniões regulares de triagem de erros e fluxo de trabalho de resolução
- Foco na prevenção: implementar melhores práticas de tratamento de erros nos processos de desenvolvimento
- Monitoramento avançado: Caminhe em direção à prevenção proativa de erros e otimização da experiência do usuário
- Progresso para o Nível 2: Depois que os erros de JavaScript estiverem sob controle, concentre-se na otimização do Core Web Vitals
Para obter orientações detalhadas sobre monitoramento e resolução de erros de JavaScript, consulte nossa documentação de monitoramento do Browser e o guia de Erros da caixa de entrada.