O Frontend Invisível: Pequenas Decisões que Salvam um Produto
O melhor trabalho de frontend nunca aparece em uma demonstração.
O trabalho que eu mais valorizo é invisível. Ninguém tira prints dele. Mas sem esse trabalho, os usuários vão embora. Você pode nunca saber o porquê de terem saído.
Esse trabalho acontece nas lacunas. Acontece entre as telas e entre o seu backend e um ser humano real.
Aqui estão três exemplos de pequenos ajustes que evitam grandes problemas.
- Corrigindo erros de login
O problema: O frontend verificava um campo de status para ver se o login funcionou. Mas o backend enviava um token válido junto com um status nulo. O usuário via um erro, mesmo tendo feito o login corretamente.
A solução: O frontend agora verifica a presença de um token em vez de uma string de status.
A lição: Um campo ambíguo em uma especificação técnica torna-se uma porta trancada para o usuário.
- Lidando com links de verificação
O problema: Um usuário abre um link de verificação em uma nova aba. A aba original fica travada. O polling do servidor falha porque a primeira aba não possui o token de login.
A solução: Use o evento de storage do navegador. Quando uma aba atualiza o local storage, todas as outras abas recebem a mensagem instantaneamente. É uma maneira gratuita e instantânea de sincronizar abas.
- Cooldowns do botão de reenvio
O problema: Um cronômetro de "Reenviar e-mail em 30 segundos" era armazenado no estado do componente. Se o usuário atualizasse a página, o cronômetro voltava para zero. Os usuários clicavam repetidamente no botão, o que aumentava seus custos de e-mail.
A solução: Não armazene a contagem regressiva. Armazene o timestamp do prazo final.
Ao salvar o horário exato em que o cooldown termina, o cronômetro sobrevive a uma atualização de página. É impossível resetá-lo recarregando a página.
Por que os fundadores devem se importar:
• A correção do login protege a ativação do usuário. • A sincronização de abas protege sua taxa de conversão. • O cooldown protege seu orçamento contra abusos.
Uma excelente engenharia não é apenas fazer a tela parecer bonita. É obcecar pelas lacunas. Esses ajustes levaram menos de cinquenta linhas de código. O valor vem de perceber o problema e corrigi-lo no lugar certo.
Fonte: https://dev.to/virendra2902/the-invisible-frontend-small-decisions-that-quietly-save-a-product-1pkl