Animação deixa o site lento?
Movimento não é automaticamente pesado; execução ruim, excesso e mídia sem controle são.
Role para ler →
Uma página pode baixar poucos arquivos e ainda travar porque o navegador recalcula e redesenha demais. Também pode carregar um vídeo grande e permanecer fluida depois do início. “Pesado” mistura transferência, memória, processamento e estabilidade visual.
Antes de remover movimento, descubra qual recurso está caro e em qual aparelho.
Alterar posição pelo layout, tamanho, filtro ou grandes áreas pintadas pode exigir trabalho novo a cada quadro. Transformações e opacidade costumam ficar numa etapa que o navegador otimiza melhor. A diferença não é CSS contra JavaScript; é o tipo de propriedade e o trabalho provocado.
`will-change` ajuda em casos pontuais, mas criar camadas demais também consome memória.
Existem movimentos de orientação, resposta, continuidade e personalidade. Uma transição pode mostrar de onde veio um painel; um feedback confirma uma ação; um gesto recorrente constrói identidade. Quando um efeito não pertence a nenhuma dessas funções, ele precisa justificar o custo apenas como atmosfera.
Atmosfera é válida. Só não deve competir com leitura, controle e velocidade.
Controle o orçamento de mídia, o de processamento, o de atenção e o de tolerância ao movimento. Uma cena pode passar no teste técnico e falhar porque tudo pulsa. Pode ser discreta e ainda causar desconforto por parallax ou zoom contínuo.
O projeto melhora quando performance e acessibilidade entram como limites criativos, não como correções no final.
Use celular comum, modo de economia, conexão limitada e ferramentas de desempenho. Observe resposta ao toque, rolagem, temperatura e consumo de memória — não apenas a taxa de quadros no notebook de criação.
Respeite `prefers-reduced-motion` com uma versão que preserve compreensão sem manter efeitos desnecessários.
Primeiro desenhamos a experiência sem depender do efeito. Depois adicionamos movimento onde ele explica hierarquia ou dá caráter. Por fim, medimos e criamos uma saída reduzida.
Se remover a animação destrói a informação, faltou uma base acessível. Se removê-la não muda nada, talvez ela seja decorativa — e tudo bem, desde que o orçamento do aparelho e da atenção comporte essa escolha.