NGinx - Otimizando Recursos Externos Automaticamente

Breve artigo explicando a importância de otimizar recursos externos (third-party resources) em um site e como fazê-lo automaticamente, com exemplos práticos e prontos para o uso.

[ Hits: 3.107 ]

Por: Paulo Paracatu em 15/12/2019 | Blog: https://medium.com/@pauloparacatu


Introdução



Nos últimos anos, diversos serviços surgiram para facilitar a vida não só de desenvolvedores, mas também de equipes de marketing, publicidade e experiência de usuário. Temos hoje bibliotecas para tudo, algumas sendo utilizadas em praticamente todo site, do mais simples ao mais complexo: Google Analytics, Google Fonts, Google Hosted Libraries, Facebook Connect, Twitter Widgets, Gravatar, entre outros.

Embora, ofereçam praticidade e agilizem o desenvolvimento e manutenção de sites, utilizar tantos serviços externos também gera alguns problemas. O tempo de carregamento do site aumenta consideravelmente, afinal, para cada recurso externo, o usuário vai precisar fazer uma nova requisição de DNS para pegar um arquivo de outro domínio.

Além disso, temos também o problema de concorrência entre as requisições, podendo bloquear o carregamento do seu site. Quando você utiliza serviços externos para entregar partes vitais do site, o navegador não consegue definir a prioridade e essas requisições passam a competir por recursos com as requisições do seu domínio, afetando negativamente a experiência do usuário, que vai ficar encarando uma tela em branco por alguns segundos até que algo seja renderizado.

Ao interceptar todos esses scripts externos e entregá-los por conta própria, você elimina o problema gerado por múltiplas resoluções de DNS e, ao mesmo tempo, consegue se aproveitar da conexão HTTP/2 única, tirando vantagens dos recursos de priorização e paralelismo do protocolo. :)

Normalmente, os mais interessados em melhorar a performance do site começam hospedando os scripts do Google Analytics por conta própria. O Google não recomenda fazer isso, mas acredite, muita gente faz!

O problema é que esses scripts são constantemente atualizados e ao hospedar por conta própria, você corre o risco de ficar com uma versão antiga, quebrando suas estatísticas. Alguns resolvem isso configurando um Cron (tarefa agendada) para atualizar os scripts de tempos em tempos, mas isso ainda me parece um trabalho manual demais e chato. E você precisa sair alterando o código do Analytics em todo lugar que tiver no site.... mais trabalho manual, argh!

Esse não é nosso estilo. Nós gostamos de automatizar tudo, não é? E é aí que surgiu a ideia de utilizar o NGinx para fazer todo o serviço para nós de forma automática.

Antes de mais nada, vamos precisar de um nginx com o módulo "sub" compilado nele. Esse módulo é oficial do NGinx, mas não vem compilado por padrão. Você pode checar se o seu NGinx tem esse módulo com um "nginx -V" e olhar na lista de módulos habilitados durante a compilação.

Se não encontrar, então esse guia não vai funcionar para você até que recompile o NGinx habilitando o módulo:
Tendo em mãos um NGinx com o módulo sub, vamos começar! Como quase todo mundo utiliza o Google Analytics, nosso primeiro exemplo será com ele.

    Próxima página

Páginas do artigo
   1. Introdução
   2. Exemplo com o Google Analytics
   3. Exemplo com o Google Fonts
Outros artigos deste autor
Nenhum artigo encontrado.
Leitura recomendada

LTSP no Debian 8

Potencializando o elementary OS

Pós-instalação do Fedora 19 (GNOME Shell)

Instalando MRTG + rrdtool no Slackware 12.0

Timezones - Uma questão de ponto de vista

  
Comentários
[1] Comentário enviado por fabio em 15/12/2019 - 17:59h

Não conhecia esse módulo do NGinx, interessante demais. Parabéns pelo artigo e obrigado por compartilhar a informação.

[2] Comentário enviado por Ragen em 18/12/2019 - 16:11h

Nice trick! Já peguei alguns sites engargalados no Google Fonts e analytics realmente faz todo sentido entregar o conteúdo sem depender da rota deles estar funcionando, pq se a requisição não chegar ao site tá tudo fora mesmo.


Contribuir com comentário