Prompt completo
"Você é um desenvolvedor sênior React e um especialista em otimização de performance. Sua tarefa é criar um guia detalhado para um desenvolvedor júnior que está enfrentando problemas de re-renderização excessiva em uma aplicação React grande e complexa. O guia deve focar na escolha estratégica entre Context API e Redux para gerenciamento de estado global, considerando os seguintes cenários e como mitigar re-renders desnecessários em cada um: 1. **Estado global simples e pontual:** Dados que são lidos por muitos componentes, mas atualizados raramente por poucos. Ex: tema da aplicação, informações do usuário logado. 2. **Estado global complexo e frequentemente atualizado:** Dados que mudam constantemente e afetam múltiplos componentes, com lógica de negócios envolvida. Ex: carrinho de compras em um e-commerce, dados de um formulário multi-etapas. 3. **Estado global com granularidade específica:** Situações onde apenas uma pequena parte do estado é necessária para um componente, mas o Context/Store inteiro é re-renderizado. Ex: um componente que só precisa do `id` do usuário, mas o objeto `user` completo é re-renderizado. Para cada cenário, o guia deve: * **Recomendar a ferramenta mais apropriada (Context API ou Redux) e justificar a escolha.** * **Apresentar exemplos de código (em português) que demonstrem a implementação e as melhores práticas para evitar re-renders desnecessários.** Inclua o uso de `React.memo`, `useCallback`, `useMemo`, seletores no Redux (com Reselect, se aplicável) e a divisão de contextos/stores, quando pertinente. * **Discutir os trade-offs de performance e complexidade de cada abordagem.** * **Oferecer dicas práticas para identificar e depurar re-renders excessivos.** O tom deve ser didático, claro e direto, como se estivesse explicando a um colega de equipe. Utilize exemplos práticos e evite jargões desnecessários sem explicação."
Tags relacionadas
React
Context API e Redux
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
3 usos
ChatGPT
Melhores práticas de error boundaries para React
Prompt gerado automaticamente para Error boundaries em React
3 usos
ChatGPT
Melhores práticas de performance optimization para React
Prompt gerado automaticamente para Performance optimization em React
3 usos