Marketing precisa adicionar um widget de chat e duas tags de analytics. Como você entrega isso sem destruir suas métricas de performance?

Carregue depois de a página ficar interativa, não no head: defer ou async, injetado em idle, ou depois de uma interação do usuário para qualquer coisa pesada como chat. Dê a eles um orçamento próprio de conexão com preconnect só se realmente necessário, defina um orçamento de tamanho e meça antes e depois com métricas de usuários reais. Se um fornecedor bloqueia a main thread, isole num worker ou num iframe, ou leve o rastreamento para o servidor.

Primeiro eu meço em vez de discutir. Adiciono cada um atrás de uma flag e olho o tempo de main thread e o tamanho transferido que custam num perfil limitado, então a conversa é sobre um número específico e não sobre sensação. Depois estratégia de carregamento: tags de analytics vão em async ou são injetadas em idle, já que nada voltado ao usuário depende delas. O widget de chat é o caro, e quase nunca precisa carregar no load da página, então renderizo um botão leve de espaço reservado e só busco o widget real no primeiro clique ou depois de a página ficar ociosa por alguns segundos. Só isso normalmente tira várias centenas de kilobytes do caminho crítico. Se um fornecedor insiste em trabalho síncrono, as opções são rodar num worker numa abordagem estilo partytown, isolar num iframe para pelo menos conter o layout, ou mover o rastreamento para o servidor. Depois coloco um orçamento de bundle e de terceiros no CI, porque essas coisas chegam uma de cada vez e cada uma parece pequena.