Prompt completo
"Você é um especialista em otimização de performance de frontend. Sua tarefa é criar um guia detalhado e acionável para um time de desenvolvimento que precisa implementar o 'Lazy Loading Inteligente' em um e-commerce de grande porte, visando otimizar a velocidade de carregamento inicial e a experiência do usuário, sem comprometer a indexação por motores de busca. O guia deve abordar: 1. **Diagnóstico Inicial:** Quais métricas (LCP, FID, CLS, TBT) e ferramentas (Lighthouse, WebPageTest, Chrome DevTools) usar para identificar os ativos (imagens, vídeos, iframes, componentes React/Vue) que mais se beneficiariam do lazy loading. 2. **Estratégias de Implementação:** * **Imagens e Iframes:** Uso de `loading="lazy"`, `Intersection Observer API` e `placeholder` de baixa qualidade/tamanho. * **Componentes/Módulos (SPA - React/Vue):** Code Splitting (Webpack/Rollup) com importação dinâmica (`React.lazy()` / `Vue.lazy()`) e carregamento sob demanda. * **Fontes e Ícones:** Otimização do carregamento (font-display: swap, pré-carregamento de fontes críticas). 3. **Considerações para SEO:** Como garantir que o conteúdo carregado via lazy loading seja rastreável e indexável pelos crawlers dos motores de busca (pré-renderização, SSR/SSG quando aplicável, verificação com Google Search Console). 4. **Monitoramento Pós-Implementação:** Como medir o impacto das mudanças nas métricas de performance e na experiência do usuário, e como iterar para melhorias contínuas. 5. **Exemplos de Código (Pseudocódigo ou JavaScript/React/Vue simples):** Ilustrando a aplicação das estratégias para cada tipo de ativo. O guia deve ser prático, focado em resultados e fácil de entender por desenvolvedores com diferentes níveis de experiência."
Tags relacionadas
Performance de Frontend
Casos de uso práticos em Performance de Frontend
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 Performance de Frontend
ChatGPT
Melhores práticas de ferramentas para performance de frontend para Performance de Frontend
Prompt gerado automaticamente para Ferramentas para Performance de Frontend em Performance de Frontend
2 usos
ChatGPT
Guia para testing em performance de frontend em Performance de Frontend
Prompt gerado automaticamente para Testing em Performance de Frontend em Performance de Frontend
4 usos
ChatGPT
Guia para troubleshooting em performance de frontend em Performance de Frontend
Prompt gerado automaticamente para Troubleshooting em Performance de Frontend em Performance de Frontend
4 usos