Prompt completo
"Como um desenvolvedor Angular experiente, estou enfrentando um problema de desempenho crítico em uma aplicação de grande escala. Identifiquei que o *change detection* está sendo disparado excessivamente em um componente complexo com muitos subcomponentes, mesmo quando os dados de entrada não mudam. Gere um guia passo a passo, detalhado e prático, para depurar e otimizar este cenário específico de *change detection* excessivo em Angular. O guia deve abordar: 1. **Ferramentas e Técnicas de Profiling:** Quais ferramentas (Angular DevTools, Chrome DevTools - Performance/Profiler, etc.) usar e como interpretá-las para identificar a origem exata dos *change detections* desnecessários. 2. **Estratégias de Otimização:** * Uso correto de `OnPush` (com exemplos práticos para diferentes cenários: inputs primitivos, objetos, arrays). * Técnicas para garantir imutabilidade dos dados (explicação e exemplos de uso de bibliotecas como Immer.js ou estratégias manuais). * Otimização de *event handlers* e *subscriptions* para evitar re-renderizações desnecessárias. * Considerações sobre *trackBy* em `*ngFor` e seu impacto no desempenho. * Estratégias para desativar temporariamente ou controlar o *change detection* em partes da aplicação (`ChangeDetectorRef`). 3. **Cenários Comuns de Armadilhas:** Quais são os erros comuns que levam a *change detection* excessivo e como evitá-los (ex: modificação direta de objetos passados por `@Input`, uso indevido de *pipes* impuros, etc.). 4. **Verificação e Validação:** Como verificar se as otimizações implementadas realmente resolveram o problema e não introduziram novos *bugs* ou regressões de desempenho. O guia deve ser escrito em um tom didático, com exemplos de código concisos quando apropriado, e focado em soluções que possam ser aplicadas em um ambiente de produção real."
Tags relacionadas
Angular
Debugging em Angular
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 Angular
ChatGPT
Melhores práticas de padrões de design em angular para Angular
Prompt gerado automaticamente para Padrões de design em Angular em Angular
1 usos
ChatGPT
Melhores práticas de ferramentas para angular para Angular
Prompt gerado automaticamente para Ferramentas para Angular em Angular
5 usos
ChatGPT
Melhores práticas de melhores práticas em angular para Angular
Prompt gerado automaticamente para Melhores práticas em Angular em Angular
1 usos