Prompt para otimizar renderização de histórico em UI de chat

Objetivo: Investigar e propor soluções de renderização para um aplicativo de chat que acumula mensagens em gigabytes, de modo a evitar lag. O problema observado: a janela de chat renderiza todo o histórico, consumindo memória e causando quedas de desempenho conforme o histórico cresce. Perguntas a responder: 1) Por que a renderização de todo o histórico causa lag? 2) Quais técnicas modernas de UI podem mitigar esse problema sem perder a fidelidade da conversa? 3) Como projetar uma arquitetura de front end com renderização virtualizada, carregamento sob demanda e retenção seletiva de mensagens? 4) Quais trade offs existem entre fidelidade de estado, busca, notificações, e uso de memória? 5) Como validar e medir o desempenho com benchmarks reproduzíveis?

Proposta de soluções (com exemplos em JavaScript/React): 
- Estratégia A: Virtualização de lista de mensagens com janela de visualização reduzida (mostrar apenas mensagens visíveis + buffer). Exemplo de código com React Window.
- Estratégia B: Carregamento sob demanda (infinite scroll) + remoção de mensagens antigas da árvore de renderização, mantendo índice de mensagens no estado, persisting apenas um cache do lado do cliente.
- Estratégia C: Renderização incremental com micro-batches (renderizar em frames diferentes para não bloquear o main thread).

Inclua:
- Um esqueleto de componente ChatWindow e de uma lista virtualizada.
- Trechos de código mínimo para cada estratégia.
- Um plano de testes: cenários, métricas (tempo de render, uso de memória, FPS), ferramentas de geração de carga (Mock chat com N mensagens), critérios de sucesso.

Observações:
- Fidelidade da conversa pode ser mantida mantendo o conjunto de mensagens acessíveis para busca e notificação, mesmo que não esteja renderizado na tela.
- Considere questões de acessibilidade, busca, sincronização com o backend e persistência local (IndexedDB, cache).