A execução de testes de desempenho de sites, usando ferramentas como o Google PageSpeed Insights ou o WebPageTest, é útil para encontrar gargalos e melhorar a performance. O uso dessas métricas são de grande valia, mas olhe-as de forma mais atenta: Não basta acelerar seu site, se você for negligente com o desempenho percebido pelo usuário na sua experiência de uso. Vejamos então o que podemos fazer para melhorar o desempenho em um site gerenciado pelo WordPress.

Acelerar ao máximo é a meta… Mas não seja obcecado por isso

Acelerar seu site!

Acelerar seu site!

Muitos querem atingir nota 100 nas ferramentas de medição de desempenho, seja por uma obsessão pessoal, seja por demanda de um cliente (sim, isso ocorre). Mas é importante parar e pensar sobre qual é a motivação por trás dessa meta a ser atingida. Muitos pensam que basta ter um site rápido, segundo a métrica do Google PageSpeed Insights. Na verdade, o objetivo do Google ao disponibilizar essa ferramenta foi trazer algumas diretrizes para melhores práticas de desempenho da web. Essa ferramenta apresenta recomendações para otimizar seu site, e se as orientações apresentadas forem seguidas, seu site será mais responsivo e mais rápido. Mas nem sempre será possível atingir a nota máxima segundo a ferramenta de medição de desempenho.

O WordPress

Quando lidamos com o WordPress e questões como acelerar um site baseado nesse CMS, isto pode ser complicado: Conhecido pela sua abrangência e seus recursos, o WordPress certamente não é um CMS dos mais rápidos, ao menos segundo a ótica dos desenvolvedores. Soma-se a isto os plug-ins de terceiros e vários scripts que entram em execução, e podemos ter facilmente um pesadelo nas nossas mãos para gerenciar.

Alguns ajustes que podem ser feitos

O Google PageSpeed Insights faz algumas sugestões que são válidas para quaisquer sites, gerenciados por quaisquer CMS. São eles:

Otimizar as imagens

Não use imagens em tamanhos maiores do que o necessário, e com mais cores do que se precisa. Uma boa maneira de ajustar isto é usar plug-ins para otimização das imagens, como o Optimus Image Optimizer. Esses plug-ins podem usar técnicas de compressão com perda e sem perda, de forma a fazer com que as imagens armazenadas no seu site ocupem menos espaço. Dependendo da situação, ele altera as imagens para o formato WebP, criado pelo Google. Isto irá acelerar o carregamento do seu site, com menos tempo de download.

Reduza o uso de JavaScript, CSS e HTML no seu site

Menos é mais”, como é muito falado. Otimizar o código JavaScript, HTML e CSS usado torna o site menor e com isso, mais rapidamente interpretado pelo navegador. Um plug-in do WordPress que pode ser usado com esse fim é o Autoptimize, que permite que as otimizações sejam feitas no HTML, JavaScript e CSS. Para acelerar o desempenho, o uso de um plug-in que faça cache da página a ser remetida será de grande valia. Alguns plug-ins, como o WordPress Cache Enabler, chegam ao requinte de detectar qual é o navegador do cliente. Se for um navegador derivado do Google Chrome (como o próprio, ou o Chromium, ou outros) ele pode dar preferência para entregar imagens no formato WebP, que são suportados por essa série de navegadores. Para tal, você deverá ligar uma opção, intitulada Create an additional cached version for WebP image support.

Eliminar recursos que estão bloqueados

Alguns recursos nas páginas estão bloqueados para renderização, por dependerem de outros recursos. Por exemplo, as fontes são elementos bloqueantes para certas seções nas páginas. Logo, é necessário carregar as fontes antes para depois carregar essas seções. O plug-in citado anteriormente (Autoptimize) pode ser usado para contornar esse problema, desmarcando a opção Force JavaScript in <head>? (sob a opção JavaScript Options) e marcando a opção Inline all CSS? (sob a opção CSS Options). Assim será possível resolver o problema do JavaScript e dos CSS. Agora, se o seu tema estiver usando fontes do Google (como a Noto Serif e outras), é possível resolver usando um plug-in que as desabilitam. O nome é Disable Google Fonts.

Alavancar o cache do browser

Este recurso é muito interessante para visitantes recorrentes no seu site. Existem vários recursos no site que são estáticos, como imagens e a maior parte do código HTML, CSS e JavaScript. Logo, uma maneira de aproveitar melhor o cache é ajustar uma data de expiração ou uma “idade máxima” para esses recursos estáticos. Logo, o navegador procurará primeiro no cache local (no disco rígido do computador) ao invés de buscar na rede. Com isso, serão menos elementos a serem transferidos, o que impacta diretamente no processo de abertura do site.

Uma solução é editar o arquivo .htaccess, e estabelecer uma idade máxima para os elementos estáticos do seu site. Você deve empregar uma solução como a abaixo:

<filesMatch “.(ico|pdf|flv|jpg|svg|jpeg|png|gif|js|css|swf)$”>

Header set Cache-Control “max-age=84600, public”

</filesMatch>

Logo, dessa forma, arquivos com as extensões ICO, PDF, FLV, JPG, SVG, JPEG, PNG, GIF, JS, CSS e SWF terão o tempo máximo de vida de 84600 segundos, ou seja, um dia inteiro. Se o usuário retornar ao site em menos de um dia, os elementos estáticos que serão carregados serão aqueles que estão no cache do seu navegador, e não na rede.

Habilitar a compressão

É possível ajustar a configuração do servidor Web para comprimir os dados antes de enviá-los para o cliente. Se os dados estão compactados, gerarão menos tráfego e serão transmitidos mais rapidamente. O computador do cliente gastará mais tempo descomprimindo essa informação. Mas, como os computadores atuais são rápidos, o tempo gasto com a descompressão é menor do que a transferência de dados.

Para habilitar essa opção, você terá que verificar na configuração do servidor Web, se ele está com esta opção habilitada.

Reduzir o tempo de resposta do servidor

Quanto mais rápido o servidor responder, melhor. Logo, para melhorar a eficiência, use um provedor de hospedagem que faça uso de um serviço de CDN, como o Cloudflare.

Remover strings de consulta

Por último, uma das recomendações a serem feitas é remover strings de consulta dos seus recursos estáticos. Alguns elementos iniciados pelo caracter “?” não são retidos em servidores proxy, o que é uma oportunidade perdida para aumentar o desempenho. Uma opção é usar o plug-in Query Strings Remover, para fazer esse serviço para você.

Objetivo alcançado!

De fato, todas essas otimizações que o Google PageSpeed Insights sugeriu, reduzirão o tempo de carga e irão acelerar seu site. Logo, implemente tantas otimizações quanto você puder, mas não esqueça de testá-las antes. Não é porque a ferramenta diz que seu site irá carregar mais rapidamente que assim será.

Mas não seja obcecado por esses números. Eles não definem a quantidade de acessos que o seu site terá. A qualidade do conteúdo que você colocará no site é que será o fator primordial para adquirir mais visitantes.