Velocidade pura com mod_pagespeed

Deixe o Google acelerar o seu website

O mod_pagespeed é um módulo do Google para Servidores HTTP Apache que pode melhorar os tempos de carregamento de página do seu website. Incorpora de forma programática e automática em seu site todas as melhores práticas para um website rápido e requer uma configuração mínima. Com o mod_pagespeed, os web hosters Apache podem aumentar a velocidade do website de forma rápida e fácil.

Michael Abernethy, Freelance Programmer, Freelancer

Mike AbernethyMichael Abernethy trabalhou com uma ampla variedade de tecnologias e clientes. Concentrou-se em criar aplicativos da web melhores e mais sofisticados, testar os limites dos navegadores nos quais executam e, ao mesmo tempo, tentar descobrir formas de facilitar a sua criação e manutenção. Quando não está trabalhando com o computador, está se divertindo com os filhos e um bom livro.



16/Fev/2012

Introdução

Pré-requisitos

Para usar o mod_pagespeed, é necessário possuir Apache versão 2.2 executando em Linux, de 32 bits ou 64 bits, com o módulo mod_deflate instalado.

Atualmente, o mod_pagespeed não suporta o Windows nem versões mais antigas do Apache (e, se eu tivesse que dar um palpite com base na documentação e nas perguntas mais frequentes, diria que essas versões não serão suportadas em breve).

O módulo Apache mod_pagespeed do Google se destina a ser um módulo "drop-in" que os web hosters Apache podem colocar na instalação de servidor para obter imediatamente um aumento considerável na velocidade de entrega de páginas. Se não souber ao certo como acelerar o website ou não otimizou a configuração para o desempenho, esse módulo pode ser a solução que procurada. Por exemplo, esse módulo pode fazer uma diferença enorme para o proprietário de um blog do Wordpress que usa uma configuração e instalação de fábrica.

O módulo mod_pagespeed combina as melhores práticas para otimizar os tempos de carregamento de página em um único que executa automaticamente todas as etapas necessárias.

Definição de velocidade

Seja qual for a velocidade da conexão com a Internet, sempre desejamos que as páginas da web carreguem mais rapidamente. Os servidores da web que enviam o conteúdo da página também querem mais velocidade por duas razões: as empresas com servidores lentos perdem clientes. E as empresas que fazem uma página individual carregar mais rapidamente podem liberar os seus próprios servidores para entregar mais páginas para todos. Embora uma pessoa talvez visite a página deles uma vez ao dia, eles entregam essa mesma página a outros clientes 100.000 vezes ao dia. Para essas empresas, até mesmo um pequeno aumento de velocidade pode ser extraordinário. .

Para os fins deste artigo, definiremos "velocidade" do ponto de vista do usuário: o tempo de carregamento de página. Uma página da web que carrega rapidamente, como www.google.com, é considerada rápida. O tempo de carregamento de página é muito baixo. De modo inverso, um site hipotético que possua apenas um servidor executando um velho Pentium II 600 MHz e contenha 40 arquivos de imagem enormes é considerado lento. O tempo de carregamento de página é muito alto. Além disso, uma página da web que é rápida com poucas visitas ao dia pode se tornar incrivelmente lenta quando alguns milhares de pessoas a visitam em um período de 10 minutos. Portanto, a "velocidade" é definida como o tempo necessário para ir de A a B, onde A = quando você pressiona "Enter" depois de digitar alguma coisa na barra de endereço e B = quando a página termina totalmente de carregar no navegador.

Do ponto de vista de um servidor da web, a melhor forma de aumentar a velocidade, sem alterar o hardware, é enviar uma quantidade menor de dados e fazer isso de forma mais rápida. Em termos mais detalhados, é conveniente diminuir a latência da máquina (latência = tempo de resposta) e diminuir o tamanho dos dados que estão sendo transferidos (o Kb físico dos dados que estão sendo transferidos). Portanto, para "acelerar" um website tanto do ponto de vista do servidor da web quanto do usuário, seria necessário diminuir a latência do servidor E o tamanho dos dados que estão sendo transferidos.

Como aumentar a velocidade

Todas as táticas possíveis para aumentar a velocidade de um website se dividem em cinco categorias: maximizar o armazenamento em cache, minimizar as consultas, minimizar a sobrecarga por solicitação, minimizar o tamanho dos dados e otimizar a renderização do navegador. Observe que cada categoria descreve uma ação radical, como "maximizar" ou "minimizar"—não existe nenhuma solução simples que envolva "ativar" ou "desativar" um recurso ou configuração, por exemplo. Vamos detalhar cada categoria e descrever o que ela faz.

Maximizar o armazenamento em cache

Os navegadores têm a capacidade de armazenar os arquivos em cache localmente. Assim, em vez de carregá-los a partir do servidor para cada carregamento de página, eles usam a cópia local. Embora isso não faça muito sentido para uma página da web dinâmica em si (como uma página de blog), o que dizer sobre todas as imagens e arquivos de CSS e de JavaScript que também são carregados com a página? Esses arquivos mudam raramente, ou nunca. Não é necessário voltar ao servidor várias vezes para buscar o mesmo arquivo de CSS, principalmente se for usado um arquivo CSS para todo o site. Todas as páginas que o usuário carrega usam o mesmo arquivo CSS, sendo assim, é perfeitamente possível usar a cópia em cache local em vez da cópia do servidor, — elas são idênticas.

Na verdade, os navegadores pegam os comandos de cache no servidor. O servidor pode dizer ao navegador se os itens são válidos, e por quanto tempo. Os servidores podem anexar esses comandos a cada arquivo. Dessa forma, uma chamada do servidor instrui o navegador a armazenar em cache um arquivo JS, um arquivo CSS, um arquivo JPG, mas NÃO um arquivo HTML ou um arquivo TXT. Além disso, pode dizer ao navegador, "os arquivos CSS e JPG não expiram durante o ano." O navegador interpreta esses comandos como se o servidor dissesse "aqui está o arquivo JPG, ele não mudará durante um ano. Neste meio tempo, use a cópia local sempre que houver uma referência a ele no meu servidor."

Minimizar as consultas

Quando um arquivo de qualquer tipo é enviado do servidor ao navegador, há uma sobrecarga associada ao estabelecimento da conexão HTTP em cada arquivo. Em outras palavras, é necessário estabelecer um canal de comunicação entre o servidor e o navegador para cada arquivo. Na maioria dos websites comuns, há necessidade de transferir diversos arquivos e, cada vez que essa sobrecarga é necessária, o servidor leva um certo tempo para gerá-la. Portanto, a redução do número de consultas reduz o tempo que o servidor tem que empregar para gerá-las.

A principal forma de fazer isso deve ser óbvia: reduzir o número de arquivos que precisam ser transferidos em uma página da web. Por exemplo, se uma página possui 10 imagens, talvez seja necessário criar 10 conexões HTTP. Entretanto, é possível reduzir o número de conexões necessárias ao combinar recursos em um número mínimo de arquivos. Por exemplo, colocar todos os plug-ins de Jquery em um arquivo ou combinar todas as imagens pequenas de uma página em um arquivo de imagem grande e, em seguida, usar CSS para mostrar somente a parte desejada dessa imagem grande.

Minimizar a sobrecarga por solicitação

Quando cada página da web é carregada, o navegador retransmite certas informações para o servidor, inclusive coisas como cookies e chamadas de POST e GET. Evidentemente, leva tempo para que cada página carregue, pois transfere por upload as informações de cookie do cliente para o servidor. Alguns websites armazenam toneladas de informações no cookie e, quanto mais informações tiverem que ser transferidas por upload, maior é a demora.

Em vez disso, é recomendável armazenar a menor quantidade possível de informações no cookie (por exemplo, somente um ID do usuário) e usar isso como chave para encontrar todas as informações necessárias que podem ser armazenadas em um banco de dados. Isso pode reduzir drasticamente o tempo de upload dessas informações.

Minimizar o tamanho dos dados

É mais fácil enviar um arquivo de imagem de 20 Kb que um arquivo de imagem de 200 Kb. Esta categoria inclui todas as práticas relacionadas, por exemplo, usar um GIF em vez de JPG ou minimizar os arquivos JavaScript e enviar imagens miniatura e não a imagem inteira, quando possível.

Otimizar a renderização do navegador

Essa categoria é complicada. Inclui práticas como o uso de seletores de CSS otimizados, mas, muitas vezes, o site já foi projetado, e a pessoa que trabalha com os arquivos CSS não é a mesma que otimiza o desempenho do servidor. Além disso, os fatores dessa categoria tendem a oferecer menos vantagens pelo trabalho realizado.

Chega de teoria. Vamos fazer o download do produto e colocá-lo em operação! Afinal de contas, esse plug-in promete integrar-se à instalação do Apache para que não seja necessário se preocupar com todos os detalhes do aumento de velocidade.

Faça o download, instale e configure o mod_pagespeed

Faça o download do pacote (consulte Recursos abaixo para obter o link) e execute o comando adequado do Linux para instalá-lo no sistema.

Depois de instalar o mod_pagespeed no sistema Linux, ele não fica automaticamente vinculado à instalação do Apache. Vamos fazer isso. Para facilitar as coisas, recomenda-se copiar o arquivo "pagespeed.conf" do diretório "conf" do Apache onde ele está instalado depois que a instalação concluir. Além disso, copie o arquivo "mod_pagespeed.so" para o diretório "modules" do Apache. Para terminar, crie os diretórios onde deseja armazenar o cache e os arquivos que o módulo irá gerar. Chamaremos os diretórios de "cache" e "files".

Em seguida, é necessário instruir o Apache a usar o módulo mod_pagespeed. Para fazer isso, é necessário editar o arquivo http.conf. Inclua a linha a seguir na parte inferior do arquivo:

Listagem 1. Modifique o arquivo http.conf do Apache
Include "{your-path-to-this-file}/pagespeed.conf"

Depois, é necessário modificar pagespeed.conf ligeiramente para que ele aponte o caminho correto dos arquivos e diretórios:

Listagem 2. Modifique o arquivo pagespeed.conf
# at line 1 of the file
LoadModule pagespeed_module {your-path-to-this-file}/mod_pagespeed.so

# down at line 25-26 in the file
ModPagespeedFileCachePath "{your-'cache'-file-path-here}"
ModPagespeedGeneratedFilePrefix "{your-'files'-file-path-here}"

Finalmente, inicie o servidor Apache.


Teste a instalação do mod_pagespeed

Verifique algumas coisas para se certificar de que a instalação do mod_pagespeed está funcionando. Evidentemente, certifique-se de que o Apache iniciou corretamente (se não iniciou, isso significa que o mod_pagespeed não está instalado/configurado corretamente). Em segundo lugar, verifique a pasta "cache" para ver se o mod_pagespeed está gravando lá corretamente.

Agora, visite uma página da web do site no qual está trabalhando (a página deve conter coisas como arquivos JS e CSS). Depois de acessar a página, verifique a pasta "cache". Os arquivos devem ser vistos lá. Eles são as versões GZipadas/compactadas dos arquivos que não podem ser reduzidos (os arquivos JS e CSS). Essa é a primeira indicação de que o mod_pagespeed está instalado e configurado corretamente.

A última verificação é o cabeçalho de resposta obtido do servidor. É possível verificar usando uma ferramenta como o Firebug ou o Page Speed do próprio Google, ou até escrever um código PHP para procurá-los. Ao verificar o cabeçalho de resposta, procure uma referência a "Modpagespeed", já que a ferramenta do Google identifica a resposta.

Parabéns! Uma verificação bem-sucedida da pasta "cache" e do cabeçalho de resposta indica que o mod_pagespeed foi instalado e configurado corretamente.


Faça experiências com o mod_pagespeed

Se quiser "brincar" com o mod_pagespeed antes de adotá-lo, siga as etapas acima e desligue o módulo no arquivo pagespeed.conf até que esteja pronto para ativá-lo. (Não é necessário desfazer as definições de configuração no arquivo http.conf do Apache.) É possível simplesmente desligar e ligar o mod_pagespeed no próprio arquivo pagespeed.conf. Procure o parâmetro ModPagespeed na linha 10. Para que essa mudança entre em vigor, é necessário reiniciar o Apache.


Conclusão

A maioria dos webmasters entende a importância da velocidade e dos tempos de carregamento de página, mas poucos são geeks dedicados do Linux que monitoram estatísticas e tempos máximos de carregamento. Para a maioria dos webmasters, uma ferramenta simples como o mod_pagespeed é ideal— instalação fácil, quase sem necessidade de configuração e tempos de carregamento de página bem melhores para os usuários.

Recursos

Aprender

Obter produtos e tecnologias

  • Faça o download do código fonte do módulo mod_pagespeed do Google.
  • Avalie produtos IBM da maneira que for melhor para você: faça download da versão de teste de um produto, avalie um produto on-line, use-o em um ambiente de nuvem ou passe algumas horas na SOA Sandbox aprendendo a implementar Arquitetura Orientada a Serviços de modo eficiente.

Discutir

Comentários

developerWorks: Conecte-se

Los campos obligatorios están marcados con un asterisco (*).


Precisa de um ID IBM?
Esqueceu seu ID IBM?


Esqueceu sua senha?
Alterar sua senha

Ao clicar em Enviar, você concorda com os termos e condições do developerWorks.

 


A primeira vez que você entrar no developerWorks, um perfil é criado para você. Informações no seu perfil (seu nome, país / região, e nome da empresa) é apresentado ao público e vai acompanhar qualquer conteúdo que você postar, a menos que você opte por esconder o nome da empresa. Você pode atualizar sua conta IBM a qualquer momento.

Todas as informações enviadas são seguras.

Elija su nombre para mostrar



Ao se conectar ao developerWorks pela primeira vez, é criado um perfil para você e é necessário selecionar um nome de exibição. O nome de exibição acompanhará o conteúdo que você postar no developerWorks.

Escolha um nome de exibição de 3 - 31 caracteres. Seu nome de exibição deve ser exclusivo na comunidade do developerWorks e não deve ser o seu endereço de email por motivo de privacidade.

Los campos obligatorios están marcados con un asterisco (*).

(Escolha um nome de exibição de 3 - 31 caracteres.)

Ao clicar em Enviar, você concorda com os termos e condições do developerWorks.

 


Todas as informações enviadas são seguras.


static.content.url=http://www.ibm.com/developerworks/js/artrating/
SITE_ID=80
Zone=Linux
ArticleID=792797
ArticleTitle=Velocidade pura com mod_pagespeed
publish-date=02162012