Sobre
Turmas
Projetos
Time
Materiais
Artigos
Aulas
PT
EN
Materiais
Materiais
· Frontend
13. Performance, Segurança e UX
17 min de leitura
→
Anterior
12. Estilização
Nesta página
Objetivo da aula
Pré-requisitos
O que você será capaz de explicar ao final
13.1. Por que Performance + Segurança + UX andam juntos
O mesmo usuário sente tudo como “qualidade”
Trade-offs reais
13.2. Performance (fundamentos práticos)
O que significa “rápido” na Web
Latência e rede (TTFB como conceito)
Peso de recursos (JS/CSS/imagens)
Renderização e bloqueios
Performance percebida: “aparecer algo útil” vs “estar 100% pronto”
Principais gargalos do front-end
Boas práticas de performance (sem depender de framework)
Imagens
CSS
JavaScript
Rede/cache
Medir antes de “otimizar no escuro”
Ferramentas e abordagens (conceito)
13.3. SEO essencial (o mínimo bem feito)
Elementos essenciais
`title` e `meta description` (únicos por página)
Headings semânticos (H1/H2)
Links com texto descritivo
Imagens com `alt`
Canonical (noção)
Sitemap/robots (noção)
SEO e renderização (visão geral)
Dados estruturados (apenas noção)
Erros comuns
13.4. Segurança: noções de XSS (defensivo e conceitual)
O que é XSS (sem ensinar ataque)
Onde o risco aparece
Princípios de prevenção (o que um dev front precisa saber)
Checklist “coisas para não fazer”
13.5. Feedback visual: loading, erro, sucesso (UX aplicada)
Por que feedback é parte de performance percebida
Loading states
Spinner vs skeleton: quando usar cada
Evitar “flicker”
Estados de erro
Estados de sucesso
Microinterações
Padrões de UI “de mercado” (exemplos pequenos)
13.6. UX (fundamentos que todo dev precisa)
Princípios práticos
UX em formulários
UX e performance
13.7. Glossário rápido
13.8. Resumo final
13.9. Referências