Prompt completo
"Você é um engenheiro de software sênior especializado em otimização de performance para aplicações React em larga escala. Um time de desenvolvedores juniores está lutando para identificar e resolver gargalos de performance em uma aplicação React existente, que lida com grandes volumes de dados em tempo real e interações complexas com o usuário. A aplicação utiliza Redux para gerenciamento de estado e Material-UI para componentes visuais. Elabore um guia passo a passo, detalhado e prático, para auditar, diagnosticar e otimizar a performance dessa aplicação React. O guia deve cobrir as seguintes áreas: 1. **Ferramentas e Métricas:** Quais ferramentas (nativas do navegador, bibliotecas, etc.) devem ser usadas para identificar problemas de performance? Quais métricas (TTI, FCP, TBT, etc.) são mais relevantes e como interpretá-las? 2. **Renderização e Re-renderização:** Como identificar re-renderizações desnecessárias de componentes? Quais estratégias (memoização com `React.memo`, `useMemo`, `useCallback`, `shouldComponentUpdate` em classes, virtualização de listas) podem ser aplicadas e em quais cenários? 3. **Gerenciamento de Estado (Redux):** Como o Redux pode impactar a performance? Quais técnicas (normalização de dados, seletores eficientes com `reselect`, imutabilidade, batched updates) podem otimizar o consumo e atualização do estado? 4. **Otimização de Recursos:** Como lidar com grandes volumes de dados (paginação, lazy loading de componentes e rotas, code splitting)? Como otimizar o carregamento de imagens e outros ativos? 5. **Melhores Práticas e Anti-Padrões:** Quais são as melhores práticas gerais para escrever código React performático? Quais anti-padrões comuns devem ser evitados? 6. **Monitoramento Contínuo:** Como implementar monitoramento de performance em produção para detectar regressões? O guia deve ser didático, com exemplos claros de código quando pertinente, e focado em soluções práticas que um time com menos experiência possa implementar. Considere cenários comuns de problemas de performance em aplicações React com as características descritas."
Tags relacionadas
React
Performance optimization
gerado-automaticamente
Como usar este prompt
1
Clique no botão "Copiar" para copiar o prompt para sua área de transferência
2
Acesse sua ferramenta de IA preferida (ChatGPT, ChatGPT, Claude, etc.)
3
Cole o prompt e adapte conforme necessário para seu contexto específico
Outros prompts de React
ChatGPT
Melhores práticas de server-side rendering para React
Prompt gerado automaticamente para Server-side rendering em React
4 usos
ChatGPT
Melhores práticas de error boundaries para React
Prompt gerado automaticamente para Error boundaries em React
4 usos
ChatGPT
Melhores práticas de performance optimization para React
Prompt gerado automaticamente para Performance optimization em React
4 usos