Jetpack Photon x Imagens GIF: o fim do conflito

Este post foi atualizado pela última vez há mais de 3 meses.

O JetPack Photon é, ou foi, um excelente jeito de otimizar qualquer site em WordPress que seja baseado em imagens. Por se tratar de uma CDN de alto desempenho, ele ainda ajuda a economizar banda, além de acelerar a carga das páginas.

Leia o que já escrevemos sobre o Jetpack:

Dizemos que “foi” um bom jeito de otimizar o WordPress porque desde a sua concepção até agora a tecnologia mudou e evoluiu bastante, e usar uma CDN só para imagens (logo, servindo-as a partir de um domínio externo) pode até prejudicar o desempenho do site haja vista o funcionamento do HTTP/2.

A melhor opção de CDN no momento é a Cloudflare, que tem planos gratuitos ilimitados.

Inclusive é possível utilizar recursos avançados da Cloudflare (que podem não estar totalmente disponíveis gratuitamente), como os Workers, para servir imagens super otimizadas de acordo com a capacidade de cada dispositivo.

Leia mais sobre Cloudflare:

De qualquer forma, manteremos o texto original para fins de registro, ou para que possa ser útil para aquelas exceções em que o Jetpack Photon seja realmente benéfico.


Qualquer um que tenha tentado usar o Photon em conjunto com imagens GIF (principalmente as animações) já passou pela frustração de ver que teria de fazer uma escolha entre usar a CDN ou usar as animações no blog.

Porém, incomodada ficava sua avó. Agora, nós contamos com a versão mais nova do Photon, que implementou um filtro que permite ao programador decidir a cada imagem se ela deve ou não ser repassada para a CDN. Há promessas de que na versão vindoura exista até uma interface gráfica para facilitar esse trabalho.

Por enquanto, tudo o que é necessário fazer para evitar que o Photon atue em suas imagens GIF é adicionar o seguinte código ao functions.php do seu tema:

<?php 
// Faz o Jetpack Phothon ignorar imagens gif

function my_photon_exception( $skip, $src ) {
        $src = strtolower($src);
        if ( strpos( $src, '.gif' ) !== false  ) return true;

        return $skip;
}
add_filter( 'jetpack_photon_skip_image', 'my_photon_exception', 10, 3 );Code language: HTML, XML (xml)

É claro que você pode implementar a lógica que desejar, este é apenas o exemplo mais básico (e provavelmente mais útil) que poderíamos apresentar.

Quero ser cliente da PortoFácil! Entre em contato

Leia também

Textos que têm a ver com este assunto:
Os melhores bancos de imagens grátis para turbinar seu conteúdo

Conheça as melhores opções para bancos de imagens grátis, com royalty free, disponíveis hoje no mercado para uso comercial e/ou pessoal.

Corrigindo problemas de imagens no WordPress

Aproveite a flexibilidade oferecida pelo WordPress para adicionar, editar, recortar, organizar e otimizar suas imagens de forma mais prática.

Como aumentar o desempenho do site com otimização de imagens

Tutorial ensina como realizar a otimização de imagens, aumentando o desempenho e o tempo de carregamento do seu site ou blog WordPress.