Apesar de as conexões de Internet estarem cada vez mais rápidas, assim como os computadores e dispositivos em geral com acesso à Internet, a obsessão por sites que carreguem cada vez mais rápido se torna cada vez mais presente e constante. Eu sei, comigo é assim também.

Embora o código HTML (ou CSS e JavaScript) das páginas seja importante para o rápido carregamento de uma página, as imagens incluídas ainda são os objetos mais pesados e que mais “atrasam” os índices de desempenho que a cada dia influenciam mais o ranqueamento dos sites.

Um estudo de caso

Na verdade, a técnica que vou descrever aqui surgiu de uma necessidade relacionada ao tamanho das imagens de um blog gigante (mais de 20.000 posts, desde 2009), porém não necessariamente vinculada ao tempo de carregamento das páginas.

O cliente estava ocupando um espaço absurdo no servidor e, por motivos que não cabem aqui, um upgrade de disco era impensável.

Como este espaço praticamente todo era ocupado por imagens resolvi então fazer a otimização "por fora" utiilzando a ferramenta jpegoptim, disponível para vários sistemas operacionais.

Ferramentas necessárias

Para otimizar o servidor inteiro deste cliente foram necessárias duas ferramentas apenas: o já citado jpegoptim e o onipresente find.

Para instalar o jpegoptim no Ubuntu Server os comandos são:

apt-get update  
apt-get install jpegoptim -y  

Os comando sacima devem ser executados com o usuário root ou precedidos do comando sudo. Se não tiver certeza absoluta de como fazer peça ajuda ao seu provedor de hospedagem.

Otimização em massa

Caso suas imagens estejam em um único diretório no servidor basta executar o comando abaixo diretamente no diretório que contém as imagens:

jpegoptim *  

Entretanto, é bem pouco provável que sua necessidade seja assim tão simples. O mais comum é que você precise otimizar o diretório de uploads do WordPress, que idealmente conterá os arquivos separados por ano e mês; se não for assim, seu WordPress está um chiqueiro, dê um jeito de consertar.

Nesse caso você pode ir no diretório em que se encontram as imagens e comandar:

find . | xargs jpegoptim  

Otimização melhorada

Se você executar o jpegoptim sem parâmetros adicionais, como nos exemplos acima, o comando vai apenas remover os "metadados" dos arquivos, mantendo as inalteradas as imagens propriamente ditas (é a chamada otimização "sem perdas", embora esta denominação seja discutível).

Entretanto, analisando as imagens que o cliente salvara no seu blog, observei que havia muitos arquivos com dimensões imensas, em qualidade JPEG 100. Em resumo, qualidade 100 é o mais próximo que o JPEG pode chegar de imagens raw, o que implica arquivos muito mais pesados do que o necessário para exibição em páginas web. Em linhas gerais uma imagem JPEG com qualidade 75 vai cumprir bem o seu papel em uma página web. Imagens JPEG com qualidade 80 aparecerão em alta qualidade para um visitante, principalmente em dispositivos de mão, cada vez mais populares.

Para otimizar de maneira extrema os arquivos de meu cliente, liberando quase 50% do espaço em disco que eles ocupavam sem perdas aparentes de qualidade, o comando completo ficou assim:

find . | xargs jpegoptim --strip-all -m80  

Os parâmetros extra significam:

  • --strip-all → remove todos os metadados do arquivo, tais como comentários, marcações de localização por GPS, etc;
  • -m80 → garante que o arquivo terá uma qualidade JPEG de no máximo 80 (poderia ser menos, mas não quis ser radical demais — uso 72 nas imagens para os meus blogs).

Vale observar que ao definir uma qualidade máxima o jpegoptim vai reduzir a qualidade apenas dos arquivos cuja qualidade original seja superior o limite informado; imagens que já tenham qualidade igual ou inferior a esse limite não serão alteradas (exceto por outro parâmetro, que no exemplo acima é o que instrui a remoção de todos os metadados).

Recomendações finais

Esteja ciente de que o jpegoptim altera o arquivo, o que implica mudar suas permissões de propriedade; talvez no final de tudo seja necessário acertar permissões novamente para que as fotos estejam disponíveis para o webserver.

E se for fazer este serviço para terceiros (seus clientes, por exemplo) é importante que eles saibam que as imagens serão alteradas, e que autorizem o procedimento; nem é por nenhum aspecto técnico, e sim por uma questão de respeito ao outro.