Recentemente, recebemos um contato de Zain Balkhi, do Awesome Motive — responsável pelo WPBeginner, WPForms, Soliloquy e outros produtos relacionados a WordPress –, pedindo para déssemos uma olhada num artigo do WPBeginner com um guia completo para aumentar a velocidade e desempenho no WordPress.

Olhamos, gostamos e eis que trazemos a tradução deste guia de performance para WordPress que, certamente, ajudará bastante com o aumento de performance de seus projetos usando a maior plataforma de conteúdos da atualidade.

Ao contrário de outros artigos, que mostram listas com “X melhores plugins de cache para WordPress” ou genéricos como “X dicas para acelerar o WordPress”, este guia completo para otimização do WordPress inclui temas mais específicos como o porquê de a velocidade ser importante, o que faz sites em WordPress ficarem lentos e quais medidas podem ser tomadas para aprimorar falhas imediatamente.

Para facilitar, eis o sumário das dicas de velocidade e desempenho/performance para WordPress:

Por que a velocidade é importante para sites WordPress?

Estudos mostram que de 2000 a 2016, a média humana atenção caiu de 12 segundos para 7 segundos. O que isso significa para desenvolvedores web? Significa que temos muito pouco tempo para mostrar aos visitantes o conteúdo do site e “convencê-los” a permanecer. Um site lento significa que os visitantes (potencialmente) sairão do site antes que ele esteja completamente carregado.

Segundo um estudo de caso da StrangeLoop envolvendo a Amazon, Google e outros sites maiores, um atraso de 1 segundo no tempo de carregamento da página pode levar a uma perda de 7% nas conversões, 11% a menos de visitas e 16% à satisfação do cliente!

Além disso, o Google e outros mecanismos de busca já começaram a penalizar sites mais lentos, empurrando-os para baixo nos resultados de pesquisa, o que significa menor tráfego para sites lentos. Em suma, quem quer mais tráfego, assinantes e geração de receita, deve fazer o site em WordPress ser rápido!

Como verificar a velocidade de um site WordPress?

Não raramente, desenvolvedores iniciantes pensam que um site é OK só porque ele não fica lento em seus próprios computadores. Isso é um enorme erro.

Uma vez que nós, desenvolvedores, visitamos nossos projetos web frequentemente — principalmente quando em fase de desenvolvimento e um período depois da entrega –, isso faz com que os navegadores armazenem o site em cache e o carreguem muito mais rápido. Isso faz com que o site carregar quase que instantaneamente.

No entanto, quase sempre um visitante normal, que está visitando o site pela primeira vez, pode não ter a mesma experiência. Na verdade, pessoas em diferentes locais geográficos terão uma experiência completamente diferente.

É por isso que se recomenda passar projetos web em serviços para testes de performance, usando ferramentas como WebPagetest ou Pingdom, que são ferramentas online gratuitas que permitem testar a velocidade de site a partir de diferentes locais do mundo.

Captura de tela do serviço Pingdom, para testes de velocidade em sites

Ao executar testes de velocidade em projetos web, certamente vem a dúvida: qual é uma boa velocidade para as páginas do site carregarem? Para um tempo de carregamento de uma página web ser considerado bom, o tempo deve ser inferior a 2 segundos.

No entanto, quanto mais rápido se conseguir este carregamento, melhor será. Alguns milissegundos de melhorias aqui e ali podem conseguir ganhos de performance de um segundo inteiro do tempo de carregamento final!

O que faz um site WordPress ficar lento?

Independentemente da ferramenta de medição de performance que estiver usando, seu relatório do teste de velocidade virá com várias recomendações de melhoria. Entender o que retarda um site WordPress é fundamental para melhorar o desempenho e tomar decisões mais inteligentes a longo prazo.

As principais causas para um site WordPress lento são:

Agora que foram mostrados alguns dos principais influenciadores negativos, que retardam um site WordPress e fazem com que seu desempenho seja ruim, veja alguns pontos sobre como acelerar o site WordPress para aumento de velocidade e desempenho.

A importância de ter uma boa hospedagem WordPress

Como foi visto, o serviço de hospedagem WordPress desempenha um papel importante no desempenho do site. Boas hospedagens, mesmo que compartilhadas, tomam medidas extras para otimização dos sites que hospedagem — existindo, inclusive, alguns serviços específicos para WordPress.

No entanto, em hospedagem compartilhada, você compartilha os recursos do servidor com muitos outros clientes. Isto significa que se o projeto web “vizinho” recebe muito tráfego, então ele pode afetar a performance de todo o servidor…

É bem mais provável que serviços de hospedagem focados em WordPress provejam configurações de servidor otimizadas para executar WordPress. Esse tipo de serviço (geralmente) também oferecem backups automáticos, atualizações automáticas do WordPress e configurações de segurança mais avançadas para proteger os site feitos na plataforma.

Alguns serviços bastante conhecidos são WPEngine e Pagely (voltado mais para projetos WordPress de grande escalabilidade), mas existe inúmeros outros que podem ser encontrados com não muito tempo de pesquisa na web.

Como melhorar a velocidade e performance de um projeto WordPress

Sabemos que fazer alterações na configuração de um site pode ser um pensamento aterrorizante para iniciantes, especialmente quando a pessoa não é um um técnico-geek. Mas, em se tratando de WordPress, não é tão complicado realizar alguns ajustes e incrementos para aumentar a velocidade e performance.

Instale um plugin de cache

Páginas WordPress são dinâmicas, isto é, são renderizadas/”construídas” on the fly cada vez que alguém visita um post ou página do site. Para construir/renderizas, o WordPress tem que executar um processo para encontrar as informações necessárias, colocá-las em conjunto e, em seguida, exibí-las para o visitante. Este processo envolve várias etapas e pode realmente causar lentidões — e até quedas — do site quando se tem vários visitantes concomitantes.

É por isso que é altamente recomendado que todo site WordPress use um plugin de cache. O cache pode tornar um site WordPress de 2 a 5 vezes mais rápido — em alguns casos, até mais!

Veja como funciona: ao invés de passar por todo o processo de geração de página, o plugin de cache faz uma cópia da página após a primeira visita e, em seguida, serve essa versão em cache para cada visita subseqüente.

WordPress: como funciona o processo de cache

Quando alguém visita o site WordPress, que é construído usando PHP, o servidor recupera informações de um banco de dados MySQL e seus arquivos PHP e, em seguida, tudo é reunido em um conteúdo HTML que é servido servido Para o visitante. É um processo longo, mas, com cache, é possível ignorar uma boa parte dele.

Há muitos plugins de cache disponíveis para WordPress, sendo os mais conhecidos W3 Total Cache e WP Super Cache — ambos não tão difíceis de serem instalados e configurados corretamente.

Se o projeto estiver em um boa hospedagem própria para WordPress, é possível que esse gerenciamento de cache seja feito de maneira automática.

Otimize imagens para performance

WordPress: otimização de imagens para performance

Imagens trazem “vida” ao conteúdo e ajudam a aumentar o engajamento. Pesquisadores descobriram que o uso de imagens coloridas torna as pessoas 80% mais propensas a ler o conteúdo em que elas estão inseridas.

Mas se as imagens não são otimizadas para a web, elas podem mais prejudicar que ajudar. De fato, imagens não-otimizadas são um dos problemas de velocidade mais comuns que se encontra em sites amadores.

Antes de fazer upload de uma foto diretamente de seu telefone ou câmera, é recomendado que se use algum software de edição de imagens e/ou algum serviço de compressão para otimizar imagens para web.

Ao invés de colocarmos neste tópico muitas dicas de otimização de imagens para sites WordPress, recomendamos que leia nosso guia de otimização de imagens para web, com muitas informações sobre este tópico vital de performance.

Melhores práticas de otimização de performance para WordPress

Depois de instalar um plugin de cache e otimizar as imagens, é nítido como o site começa a carregar muito mais rápido. Mas, para realmente manter um projeto WordPress o mais rápido possível, é preciso usar as melhores práticas listadas abaixo.

Mantenha o WordPress atualizado

Como um projeto open source bem mantido, o WordPress é atualizado com freqüência. Cada atualização não só oferece novos recursos, mas também corrige problemas de segurança e bugs. O mesmo se aplica para temas e plugins, que geralmente contam com atualizações regulares. Não deixar um projeto WordPress sempre atualizado pode tornar o seu site lento e não confiável, além de o deixar exposto e vulnerável a possíveis ameaças de segurança.

Use resumos na página inicial e arquivos

Por padrão, o WordPress exibe o conteúdo completo de cada artigo em sua página inicial e arquivos. Isso significa que a página inicial, categorias, tags e outras páginas de arquivos serão carregadas mais lentamente. Outra desvantagem de mostrar artigos completos nestas páginas é que isso desestimula a visita às páginas dos artigos, em si. Isso pode reduzir visualizações de página e o tempo que as pessoas passam no site.

Para acelerar o tempo de carregamento das páginas de arquivos, é possível definir para que resumos sejam exibidos ao invés do conteúdo completo. Isso é feito através do menu Configurações > Leitura.

WordPress: configuração para exibir resumos

Divida comentários em páginas

Suas páginas ou artigos de blog costumam receber muitos comentários? Parabéns! Este é um ótimo indicador de um público envolvido. Mas a desvantagem (técnica) é que carregar todos esses comentários pode afetar a velocidade do site.

O WordPress conta com uma solução nativa para isso. Basta ir a Configurações > Discussão e marcar para a caixa ao lado da opção “Dividir comentários em páginas”.

WordPress: opção para dividir comentários em páginas

Usar soluções de terceiros também pode ser uma boa alternativa. Aqui no desenvolvimento para web, por exemplo, utilizamos o Disqus — que, para poupar recursos e não interferir na performance, é carregado dinamicamente, somente quando a rolagem da tela está próxima da seção de comentários.

Use uma Content Delivery Network (CDN)

Lembra-se de que foi mencionado acima que acessos em diferentes locais geográficos podem experimentar diferentes tempos de carregamento do site? Isso porque a localização dos servidores de hospedagem pode ter um impacto na velocidade. Por exemplo, digamos que a hospedagem tenha seus servidores nos Estados Unidos; um visitante que também está nos Estados Unidos geralmente experimentará tempos de carregamento mais rápidos do que um na Índia.

Usar uma CDN, ou Content Delivery Network (“Rede de Entrega de Conteúdo”), pode ajudar a acelerar os tempos de carregamento para todos os visitantes. Uma CDN é uma rede composta de servidores em todo o mundo em que cada servidor armazena arquivos estáticos usados ​​para compor o site — por “arquivos estáticos” se está querendo dizer os arquivos que são imutáveis​, ​como imagens, CSS e JavaScript, ao contrário das páginas do WordPress que são “dinâmicas”, como explicado acima.

Quando se usa uma CDN, cada vez que alguém visita o site, ele recebe os arquivos estáticos do servidor que é mais próximo geograficamente. O próprio servidor de hospedagem do site também será mais rápido, já que a CDN está fazendo muito trabalho, poupando recursos preciosos.

Em não muito tempo de busca na web é possível encontrar bons serviços de DNS, tanto pagos, quanto de graça. Existem, também, os específicos para WordPress. Procure indicações e/ou faça testes com alguns para ver o que mais se adéqua a seu(s) projeto(s).

Não faça upload de vídeos diretamente no WordPress

Logo do YouTube

Sim, é possível fazer upload de vídeos diretamente no WordPress — que serão exibidos automaticamente em um player HTML5 –, mas você nunca deve fazer isso!

Hospedar vídeos custa muita largura de banda — dependendo de seu contrato com a empresa de hospedagem, haverá taxas extras ou eles podem até mesmo bloquear o site completamente. Além disso, também aumenta tremendamente o tamanho dos backups e, conseqüentemente, torna muito mais difícil uma eventual restauração.

Em vez disso, você deve usar um serviço de hospedagem de vídeo como o YouTube, Vimeo, DailyMotion etc, e deixá-los cuidar do trabalho duro. Eles têm a largura de banda e infra-estrutura ideal para isso!

O WordPress tem um recurso automático de incorporação de vídeos, então tudo o que é preciso fazer é copiar e colar o URL do seu vídeo diretamente no editor e ele será incorporado automaticamente.

Use um tema otimizado para performance

WordPress: use tema otimizado para velocidade

Ao selecionar um tema do WordPress, é importante dedicar uma atenção especial à sua otimização para performance. Alguns temas bonitos e de aparência impressionante são realmente mal codificados e podem fazer o site ficar lento.

Geralmente, é melhor optar por um tema mais simples e usar plugins de qualidade para obter os recursos de que você precisa do que escolher um tema “inchado”, com layouts complexos, animações chamativas e outros recursos desnecessários — claro, há exceções a isto, dependendo do tipo de projeto web necessário.

Use plugins otimizados

O WordPress começou como um sistema para blogs, mas, atualmente, é indiscutível que ele é muito mais: tornou-se uma plataforma completa para o desenvolvimento de todo tipo de sites e sistema web. Para tanto, é bastante comum — e, às vezes, imprescindível — o uso de determinados plugins.

E, dentro da miríade de plugins existentes, existem muitos que se propõem a executar as mesmas tarefas, como carousels, galerias, lightboxes etc. Na hora de escolher plugins WordPress, é importante ser zeloso e optar pelos plugins com melhor performance, otimizados para velocidade, que não comprometam o desempenho do site WordPress.

Por exemplo, quando o assunto é carousel/slider, se você realmente quiser usar um em seu projeto — o que é desaconselhado –, veja uma pequena comparação de alguns dos mais famosos plugins disponíveis:

Plugin Carregamento da página Requisições Tamanho da página
Soliloquy 1,34s 26 945 KB
Nivo Slider 2,12s 29 1 MB
Meteor 2,32s 27 1,2 MB
Revolution Slider 2,25s 29 1 MB
LayerSlider 2,12s 30 975 KB

Outro exemplo poderia ser dado para plugins WordPress de galerias de imagens:

Plugin Carregamento da página Requisições Tamanho da página
Envira Gallery 1,08s 24 1 MB
Foo Gallery 1,89s 23 357,1 KB
NextGEN 1,88s 33 518 KB

Estes foram somente alguns exemplos. É interessante sempre realizar alguns testes com plugins WordPress — ou encontrar alguém que tenha feito para conferir — antes de optar por algum. Economizar muitos KB em cada plugin e usar sempre plugins mais performáticos faz toda a diferença.

Otimizações avançadas de performance para WordPress

Ao se valer das dicas mostradas até agora, certamente qualquer projeto em WordPress será muito mais veloz e performático. Mas cada esforço conta; então, para conseguir alcançar níveis surpreendentes de otimização, também vale seguir as dicas avançadas de performance para WordPress a seguir.

Reduza requisições HTTP externas

desenvolvimento para web: exemplo de requisições

Exemplo de página com recursos otimizados (nenhum arquivo em cache)

Muitos plugins e temas do WordPress carregam todos os tipos de arquivos de outros sites. Esses arquivos podem incluir scripts, folhas de estilo, fontes e imagens de recursos externos como Google, Facebook, serviços de análise e assim por diante. E está tudo bem usar alguns destes, já que muitos destes arquivos são otimizados para carregar o mais rápido possível, sendo até mais rápidos do que hospedá-los no próprio site.

Mas se vários plugins estão fazendo muitas requisições externas, então isso pode prejudicar o desempenho do site significativamente.

É possível reduzir todas essas solicitações HTTP externas desativando scripts/estilos e/ou os combinando em um único arquivo através de ferramentas de automatizadores de tarefa como o Gulp, por exemplo. Também, independentemente de se tratar de um projeto WordPress, adotar boas práticas de performance, em geral, também é algo positivo.

Reduza chamadas ao Banco de Dados

Como citado, infelizmente há muitos temas WordPress mal codificado disponíveis. Muitos destes ignoram práticas padrão do WordPress e acabam fazendo chamadas diretas ao banco de dados ou muitas solicitações desnecessárias ao BD. Isso pode realmente retardar o servidor, já que demanda muito trabalho extra para ser feito.

Mesmo temas bem codificados podem ter código que faz chamadas de banco apenas para obter informações básicas do site. Por exemplo, este trecho de código não é difícil de ser encontrado em muitos temas por aí (incluindo o doctype não-HTML5):

Infelizmente, é uma situação difícil em que não se pode culpar os desenvolvedores dos temas; afinal, realmente não há outra maneira de descobrir essas informações.

Mas se você estiver personalizando o site usando um tema filho, então é possível substituir essas chamadas ao Banco de Dados com informações específicas, a fim de reduzir todas as chamadas ao BD. Poderia-se, no tema filho, alterar para:

Dependendo do caso — e das condições que se tem para o desenvolvimento –, também é possível alterar diretamente o tema que se está mexendo ao invés de se criar um tema filho, mas isso deve ser feito com muita cautela para evitar transtornos em eventuais atualizações do tema.

Se o caso for um tema próprio, desenvolvimento “do zero” especialmente para algum projeto, então é possível já poupar estas requisições extras ao Banco de Dados já no momento da codificação.

Otimize o Banco de Dados WordPress

Performance WordPress: otimização do banco de dados

Depois de usar o WordPress por um tempo, o banco de dados terá muitas informações que, provavelmente, não são de grande utilidade. Para melhorar o desempenho, é possível otimizar o BD para se livrar de todas essas informações desnecessárias.

Isso pode ser facilmente gerenciado através de plugins criados especialmente para a tarefa, como o WP-Sweep, que permite que se limpe o banco de dados WordPress, excluindo coisas como postagens de lixeira, revisões, tags não utilizadas etc — ele também permite otimizar a estrutura do Banco de Dados com apenas um clique.

Limite revisões de posts

As revisões de postagens ocupam espaço no Banco de Dados WordPress. Alguns acreditam que as revisões também podem afetar algumas consultas ao BD feitas por plugins. Se o plugin não excluir especificamente as revisões de postagens, poderá tornar o site mais lento, procurando por elas desnecessariamente.

É possível limitar o número de revisões que o WordPress mantém para cada artigo facilmente, bastando adicionar esta linha de código ao arquivo wp-config.php:

Esse código limitará o WordPress apenas a salvar as últimas 4 revisões de cada postagem ou página e descartar as revisões mais antigas automaticamente.

Conclusão sobre velocidade e performance em sites WordPress

Como foi visto neste guia completo para aumento de velocidade e desempenho do WordPress, existem dicas, técnicas e medidas possíveis de serem feitas a fim de melhorar o desempenho de um projeto web feito em WP.

É importante sempre lembrar que qualquer projeto WordPress não deixa de ser um projeto PHP normal e um projeto normal que usa HTML, CSS e JavaScript como qualquer outro site. Então, dicas de melhoria de performance que valeriam para sites não-WordPress, certamente se aplicam a sites WordPress, como minificar e combinar assets, reduzir requisições HTTP, prevenir hotlinking de recursos, trabalhar com Gzip, usar boas CDNs etc.

Assim como qualquer outro projeto web “normal”, é esperado que sites feitos em WordPress não consigam usar absolutamente todas as técnicas e boas práticas de desempenho/performance existentes; o importante é entender o motivo da existência de cada uma dessas técnicas para saber quando é realmente vantajoso aplicá-las ou deixar de aplicá-las — e até modificá-las para ficarem mais consonantes ao projeto sendo desenvolvido.

Provavelmente a melhor dica é: conheça o que pode ser feito e tenha bom-senso ao fazer (ou deixar de fazer).