O que é compactação de imagens?

O que é compactação de imagens?

A compactação de imagens é um processo que reduz o tamanho dos arquivos de imagem. Na maioria das vezes, a compactação de imagens funciona removendo bytes de informações da imagem ou usando um algoritmo de compactação de imagens para reescrever o arquivo de imagem de uma forma que ocupe menos espaço de armazenamento. A compactação de uma imagem é uma maneira eficaz de garantir que ela seja carregada rapidamente quando um usuário interage com um site ou aplicativo. É uma parte importante da otimização de imagens.

A título de exemplo, aqui está uma imagem com 96 KB de tamanho:

Aqui está a mesma imagem, compactada em 70 KB:

E aqui está compactada em 35 KB:

Por que a compactação de imagens é importante?

As imagens compactadas são carregadas mais rapidamente do que as imagens não compactadas. Isso é importante porque a velocidade de carregamento de páginas e aplicativos web tem um enorme impacto sobre a SEO, taxas de conversão, a experiência digital do usuário e outras métricas essenciais. Melhorar o desempenho na web é uma das principais maneiras de os desenvolvedores otimizarem os sites.

A compactação de imagens é normalmente usada juntamente com outros métodos para melhorar o desempenho na web também.Por exemplo, uma CDN armazena em cache o conteúdo para distribui-lo mais rapidamente aos usuários finais. O balanceamento de carga ajuda a evitar que os servidores web fiquem sobrecarregados. O uso do lazy loading pode permitir que o conteúdo mais importante de uma página web seja carregado ainda mais rapidamente. No entanto, de modo geral, a compactação de imagens costuma ser uma das maneiras mais rápidas de corrigir o desempenho lento das páginas.

O que é compactação de imagens com perdas?

Pense em um viajante fazendo as malas para uma viagem. É possível que o viajante leve tudo o que tem no armário, de sapatos a chapéus e roupas formais. Mas essa abordagem resulta em uma grande quantidade de bagagem que o viajante precisa carregar, o que o atrasa e talvez custe mais caro para transportar. Em vez disso, o viajante seleciona os itens de vestuário mais importantes e os coloca em uma única mala.

Assim como nosso viajante não precisou levar todo o seu guarda-roupa, as pessoas raramente precisam visualizar uma imagem inteira em sua resolução máxima e em suas maiores dimensões. (O tamanho de tela de desktop mais usado é 1680x1050 pixels e o tamanho de tela de celular mais usado é ainda menor, 360x800 pixels. Mesmo com essas dimensões, é raro que uma imagem ocupe toda a tela). Normalmente, uma imagem pode ter sua qualidade e tamanho reduzidos de uma forma que não seja perceptível para o espectador comum, uma abordagem chamada compactação de imagens "com perdas".

A compactação de imagens com perdas retém as informações mais significativas da imagem sem manter cada pixel. Há vários tipos de algoritmos de compactação com perdas, descritos em mais detalhes abaixo. Mas todos funcionam removendo informações do arquivo de imagem para que o arquivo seja composto por menos bytes.

Métodos de compactação de imagens com perdas

Muitas imagens hospedadas na web estão em um formato de arquivo que usa compactação com perdas. Isso garante que as imagens sejam carregadas rapidamente e não usem muita largura de banda. Exemplos comuns de métodos de compactação com perdas incluem:

• JPEG: esse formato de arquivo, batizado com o nome do Joint Photographic Experts Group, talvez seja o método de compactação de imagens mais amplamente utilizado. Normalmente, ele pode compactar arquivos em uma proporção de 10:1 com uma redução mínima na qualidade da imagem. As versões mais recentes do JPEG incluem o JPEG 2000 e o JPEG XR, mas muitos navegadores não são compatíveis com esses formatos.
• WebP: embora o WebP também seja compatível com a compactação sem perdas, ele é mais comumente usado para compactação de imagens com perdas. O Google desenvolveu originalmente o WebP para substituir os formatos de arquivo JPEG, PNG e GIF.
• High Efficiency Image Format (HEIF): o High Efficiency Image Format (HEIF) é um tipo de arquivo contêiner para imagens compactadas. As imagens compactadas com esse método às vezes são chamadas de arquivos HEIC.

O que é compactação de imagens sem perda?

Se as roupas desejadas por nosso viajante não couberem na mala, ele pode tentar dobrá-las novamente e reorganizá-las para que caibam melhor. Da mesma forma, a compactação de imagens "sem perda" usa algoritmos matemáticos para reescrever um arquivo de imagem sem remover nenhuma informação. Uma imagem tratada com compactação sem perda deve parecer basicamente idêntica à original, mas deve ter um tamanho de arquivo muito menor.

Embora a compactação sem perdas possa reduzir o tamanho dos arquivos de imagem em até 40%, ela ainda é menos eficaz do que a compactação com perdas para reduzir o tamanho do arquivo e otimizar as imagens para a web. Os criadores de sites devem considerar cuidadosamente as necessidades de seus usuários finais e testar a velocidade de seus sites ao decidir entre a compactação de imagens com e sem perdas.

Métodos de compactação sem perdas

Os métodos de compactação sem perdas amplamente usados incluem:

• Portable Network Graphics (PNG), que às vezes é usado na web em vez de JPEG ou WebP.
• Graphics Interchange Format (GIF), também frequentemente usado na web.
• Os arquivos Bitmap (BMP) geralmente são muito grandes para uso prático na web.
• As imagens RAW não são compactadas de forma alguma. As câmeras digitais tiram fotos em RAW, mas elas devem ser convertidas para outro formato e compactadas antes de serem usadas em um site (a menos que o site seja especificamente destinado a exibir imagens de altíssima qualidade).

Quais são os algoritmos de compactação de imagens mais comuns?

Os métodos de compactação com e sem perdas usam vários algoritmos de compactação de imagens (um algoritmo é um conjunto de regras a serem seguidas por um computador) para obter tamanhos de arquivo menores. A codificação de transformação, a codificação de comprimento de execução, a codificação aritmética, o LZW, o flate/deflate e a codificação Huffman são exemplos de algoritmos de compactação de imagens.

Codificação de transformação é um algoritmo de compactação de imagens com perdas que geralmente usa uma técnica chamada transformada discreta de cosseno (DCT), que é uma forma de representar matematicamente um arquivo usando menos informações. O JPEG se baseia na codificação ds transformada.

Codificação de comprimento de execução (RLE) é um algoritmo de compactação sem perdas que codifica pixels repetidos. Por exemplo, se houver oito pixels brancos em uma linha, em vez de escrever todos os oito pixels (como WWWWWWWWWW), ele registra o número de pixels (como 8W).

Codificação aritmética é outro tipo de algoritmo de compactação sem perdas. Como qualquer arquivo digital, as imagens digitais são representadas em níveis computacionais mais baixos com uma sequência de caracteres. A codificação aritmética codifica os caracteres usados com frequência em um arquivo de imagem com menos bits e os caracteres menos usados com mais bits. O resultado é menos bits em geral em comparação com a sequência original de caracteres.

Codificação de Huffman é semelhante à codificação aritmética, mas geralmente não reduz tanto o tamanho do arquivo.

LZW - o algoritmo Lempel-Ziv-Welch é um método de compactação sem perdas baseado no LZ77 e no LZ78, dois algoritmos de compactação mais antigos.

Flate/deflate é um algoritmo de compactação sem perdas baseado na codificação Huffman e na compactação LZ77.

Como compactar uma imagem usando a Cloudflare

A Cloudflare oferece três produtos para armazenar, armazenar em cache, otimizar e redimensionar imagens para garantir que elas sejam carregadas o mais rápido possível:

• Cloudflare Images
• Redimensionamento de imagens da Cloudflare
• Cloudflare Polish

Com esses serviços, os proprietários de sites podem otimizar imagens com um clique, converter imagens em formatos de arquivo compactados, como WebP, e personalizar quais tamanhos de imagem são carregados em quais dispositivos. Saiba mais sobre esses serviços nos links acima ou comece a usar um plano da Cloudflare aqui.