#365Posts – Torne seu blog mais rápido com o WP Minify
Visitantes mais atentos devem ter notado que este blog está muito mais rápido para carregar do que jamais foi. São muitos os responsáveis pelo “milagre”, entre eles um VPS NX que contempla aceleração HTTP pelo Varnish, e otimização em geral pelo ModPageSpeed, uso correto de caches, um tema concebido desde o início para ser leve, etc.
Porém, depois de o site estar todo otimizado consegui adicionar uma camada extra de velocidade utilizando o plugin WP Minify.
O que é encolhimento — “minify” — de arquivos
Em resumo, arquivos .js
(script) e .css
(folhas de estilo) são desenvolvidos de maneira a serem o tão claros e fáceis de compreender na percepção de um ser humano. São linhas em branco, comentários, e tudo que permita que uma outra pessoa, ou mesmo o autor do script ou folha de estilo, consiga manter o código posteriormente sem dificuldades ou apenas com o mínimo necessário.
Já os navegadores não precisam dessa beleza toda, o que importa é que o código chegue a eles corretamente. Comentários, espaços em branco, quebras de linha, nada disso é importante para a máquina.
Na verdade, quanto menos espaços em branco houver no código entregue ao navegador, melhor será o seu desempenho ao ser interpretado. Da mesma forma, quanto menos arquivos o navegador precisar receber para montar uma página, melhor será o seu desempenho.
A operação de “encolhimento” de scripts, portanto, consiste em tomar como entrada do processo um script ou folha de estilos convencional e obter como saída um arquivo equivalente, porém subtraído de tudo que é excesso, conforme explicado acima. Indo um passo além, a operação de encolhimento pode pegar diversos arquivos do mesmo tipo e combinar o seu código em um único arquivo encolhido que será efetivamente entregue ao navegador dos visitantes.
Como usar o WP Minify
Cada caso é um caso. Apesar de clichê é bom estar atento às possibilidades de problemas que possam aparecer ao se tentar utilizar o WP Minify. Entretanto, a boa notícia é que eu normalmente levo azar nessas coisas, e em todos os blogs que eu usei o plugin, foi só questão de ativar e usar, sem conflitos nem problemas.
A partir do momento em que for ativado, o plugin vai interceptar as páginas antes de elas serem entregues ao navegador, e identificar todos os arquivos .js
e .css
externos. Em seguida vai encolhê-los e combiná-los em um arquivo só de cada tipo, e reescrever as chamadas do código original para ignorar os arquivos originais e referenciar apenas os arquivos encolhidos.
Atenção: é extremamente importante que você use um plugin de cache configurado de maneira bem agressiva para que a operação de encolher arquivos não se torne mais pesada do que a exibição da própria página “crua”.
Como tornar o WP Minify mais robusto
Lembra que na seção acima eu disse que não tinha tido nenhum problema para usar o WP Minify? Espero que você não tenha acreditado, pois eu estava mentindo. Na verdade, eu tive problemas com os arquivos JavaScript deste blog, e levei várias horas debugando o código gerado pelo Minify até conseguir identificar qual era o problema e elaborar um hack que fizesse o plugin funcionar sempre.
O que estava acontecendo era que um dos plugins de frescuras visuais que uso aqui estava referenciando um script com uma URL fora dos padrões, com duas barras consecutivas, em vez de uma só. Por exemplo: em vez de /caminho/do/script.js
ele referenciava /caminho/do//script.js
.
O navegador não tem problemas para interpretar um arquivo assim, porém o plugin estava recebendo um erro estranho, e quebrando o leiaute das páginas.
Uma vez que identifiquei que era este o problema, foi fácil de criar um remendo que evitasse a repetição do problema.
Dentro do diretório do plugin existe um subdiretório chamado min
que é o coração da operação de encolhimento. Neste subdiretório há vários arquivos, mas o único que nos interessa é o config.php
, que contém uma série de parâmetros para o funcionamento do encolhedor (e você, muito provavelmente, não precisa se preocupar com nenhum). Adicione em algum lugar do arquivo as seguintes linhas, salve o arquivo, e pronto.
// Corrige o bug das barras duplas if (isset($_GET['f'])) $_GET['f'] = str_replace('//', '/', $_GET['f']);
A vantagem desta abordagem é que você não precisa se preocupar caso a próxima versão do plugin continue com esse problema: as configurações são protegidas das atualizações normais, de modos que você pode atualizar o plugin sempre que necessário sem medo de perder o seu hack.
Caso alguém pergunte por que eu fiz esse hack e não sugeri que de alguma forma o código fosse formalmente integrado ao script, responderei que eu tentei por vários dias contato com o autor do plugin, mas haja vista a sua popularidade (do plugin, não do cara) o sujeito não se mostra muito amigável a quem queira falar do trabalho dele.