Skip to content
Sobre Blog Aprender Explorar padrões Case studies
Nesta página
  • Desempenho
    • Rede
    • Renderização
  • O que fazer sobre isso
  • Home
  • All articles

Desempenho do JavaScript de terceiros

Descubra como o JavaScript de terceiros pode afetar o desempenho e o que você pode fazer para evitar que ele diminua a velocidade de seus sites.

Aug 13, 2019
Available in: English e Español
Appears in: Tempos de carregamento rápidos
Milica Mihajlija
Milica Mihajlija
TwitterGitHubHomepage
Nesta página
  • Desempenho
    • Rede
    • Renderização
  • O que fazer sobre isso

O JavaScript de terceiros geralmente se refere a scripts incorporados em seu site que são:

  • Não é de sua autoria
  • Servido a partir de servidores de terceiros

Os sites usam esses scripts para vários fins, incluindo:

  • Botões de compartilhamento social
  • Incorporação do reprodutor de vídeo
  • Serviços de bate-papo
  • Iframes de publicidade
  • Scripts de análise e métricas
  • Scripts de teste A/B para experimentos
  • Bibliotecas auxiliares (como formatação de data, animação e bibliotecas funcionais)

Os scripts de terceiros podem fornecer funcionalidade poderosa, mas essa não é toda a história. Eles também afetam a privacidade, a segurança e o comportamento da página⁠ — e podem ser particularmente problemáticos para o desempenho.

Desempenho #

Qualquer quantidade significativa de JavaScript pode diminuir o desempenho. Mas como o JavaScript de terceiros geralmente está fora do seu controle, ele pode trazer problemas adicionais.

Rede #

Configurar conexões leva tempo e enviar muitas solicitações a vários servidores causa lentidão. Esse tempo é ainda mais longo para conexões seguras, o que pode envolver pesquisas de DNS, redirecionamentos e várias viagens de ida e volta para o servidor final que lida com a solicitação do usuário.

Os scripts de terceiros costumam aumentar a sobrecarga da rede com coisas como:

  • Disparo de solicitações de rede adicionais
  • Exibição de imagens e vídeos não otimizados
  • Cache de HTTP insuficiente, o que força a busca frequente de recursos de rede
  • Recursos de Compressão do servidor insuficiente
  • Várias instâncias de estruturas e bibliotecas exibidas por diferentes incorporações de terceiros

Renderização #

A maneira como o JavaScript de terceiros é carregado é muito importante. Se for feito de forma sincronizada no caminho de renderização crítico, ele atrasa a análise do resto do documento.

Termo chave

O caminho de renderização crítico inclui todos os recursos de que o navegador precisa para exibir o conteúdo da primeira tela.

Caso um terceiro tiver problemas no servidor e não conseguir entregar um recurso, a renderização será bloqueada até que a solicitação expire, o que pode ser de 10 a 80 segundos. Você pode testar e simular esse problema com os testes de ponto único de falha do WebPageTest.

Os scripts de teste A/B também podem atrasar a renderização. A maioria deles bloqueia a exibição de conteúdo até que concluam o processamento — o que pode ser verdadeiro até mesmo para scripts de teste A/B assíncronos.

O que fazer sobre isso #

Usar o JavaScript de terceiros geralmente é inevitável, mas há coisas que você pode fazer para minimizar os efeitos adversos:

  • Ao escolher recursos de terceiros, dê preferência aos que enviam a menor quantidade de código e, ao mesmo tempo, fornecem a funcionalidade de que você precisa.
  • Use os orçamentos de desempenho para conteúdo de terceiros para manter seus custos sob controle.
  • Não use a mesma funcionalidade de dois fornecedores diferentes. Você provavelmente não precisa de dois gerenciadores de tags ou duas plataformas analíticas.
  • Audite e limpe rotineiramente scripts redundantes de terceiros.

Para aprender como auditar o conteúdo de terceiros e carregá-lo com eficiência para melhor desempenho e experiência do usuário, verifique as outras postagens na seção Otimize seus recursos de terceiros.

Desempenho
Last updated: Aug 13, 2019 — Improve article
Return to all articles
Compartilhar
assinar

Contribute

  • Registrar um bug
  • Visualizar código-fonte

Conteúdo relacionado

  • developer.chrome.com
  • Atualizações do Chrome
  • Estudos de caso
  • Podcasts
  • Shows

Conectar

  • Twitter
  • YouTube
  • Google Developers
  • Chrome
  • Firebase
  • Google Cloud Platform
  • Todos os produtos
  • Termos e privacidade
  • Diretrizes da comunidade

Except as otherwise noted, the content of this page is licensed under the Creative Commons Attribution 4.0 License, and code samples are licensed under the Apache 2.0 License. For details, see the Google Developers Site Policies.