Prompt para casos de uso práticos em performance de frontend em Performance de Frontend

"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."