Melhore a velocidade: Compacte as imagens!

with Nenhum comentário

Para carregar a página principal deste site, no momento em que estou escrevendo esta postagem, o teu navegador teve que buscar 61 arquivos diferentes, entre imagens, código e fontes, totalizando 1.7MB. 30 arquivos foram somente de imagem, desde um pequeno ícone até as images mais relevantes da página.

Agora, imagina usar uma imagem salva direto da câmera de um celular com 4MB de tamanho. Toda vez que um novo cliente acessasse o site ele teria que consumir 4MB só para ter acesso a uma imagem. Isso atrapalha o teu ranking no Google, pode comprometer o teu limite de transferência na hospedagem do site e pode até fazer alguém desistir de consumir o teu site.

Então, vamos compactar?

Compactar online: TinyPNG

O site www.tinypng.com foi o meu primeiro contato com um serviço de compactação online simples e sem burocracia. Você pode compactar quantas imagens quiser, desde que elas não ultrapassem 5MB. Depois de compactadas, você pode baixar uma a uma ou baixar um arquivo compactado contendo todas as imagens.

Homepage do site TinyPNG.com
Homepage do site TinyPNG.com, união do prático com o simpático.

Para conseguir diminuir o tamanho do arquivo final, o TinyPNG remove diversos campos do cabeçalho da imagem, como detalhes da câmera, localização, brilho, autoria, entre outros. Além disso, ele utiliza um algoritmo de compressão sem perdas, ou seja, ele muda a forma como os dados são montados dentro do arquivo, mas não “perde” nenhuma informação da imagem.

Como teste, peguei a seguinte foto de uma viagem para o litoral e compactei no tinypng.com.

Paisagem de exemplo para compactação
Imagem original com 1.8MB
Tela de compactação, de 1.8MB para 0.65MB.
Informações que ficam salvas junto com o arquivo de imagem.

Então fica a dica para a próxima vez que for enviar uma imagem por e-mail ou subir para o teu site.

Compactar automaticamente: re.Smush.it para WordPress

Quando comecei o meu primeiro site WordPress, eu compactava as imagens manualmente no tinypng.com e depois subia para o site. O problema é que com o tempo fui tendo cada vez mais trabalho e mais imagens para enviar.

Depois de muito processo manual eu decidi procurar uma alternativa automatizada para esse problema. “Com certeza, deve existir um plugin WordPress que faz isso” eu pensei e estava certo. Dentre todos os plugins de compactação que avaliei, eu gostei muito do https://resmush.it/.

Ele faz compactação lossless (sem perdas) direto no servidor do site. Vantagem por não precisar enviar as imagens para outro servidor, desvantagem por usar mais processamento do servidor do site.

No geral, o re.Smush.it diminui 65% do tamanho de todas as imagens, o que melhora o consumo de disco da hospedagem e o carregamento do site.

Lembrando que o WordPress gera outros tamanhos para cada imagem que é enviada, todas com menor resolução. Assim, além de ter a imagem original com menor tamanho, todas as imagens que o WordPress gera também ficam com tamanho reduzido.

Maurício Dau
Seguir Maurício Dau:

Engenheiro de Computação e Fundador da Doggus.xyz

Maurício Dau
Últimos Posts de