Estamos sempre buscando formas novas e inovadoras de acelerar e otimizar ainda mais seus sites WordPress. Nos últimos meses, nossa equipe tem trabalhado nos bastidores com os desenvolvedores do WP Rocket para coordenar algumas mudanças em seu novo plugin versão 3.0 (lançado em 3 de abril de 2018). Estamos animados em anunciar que o WP Rocket 3.0 e a Kinsta agora são completamente compatíveis e sempre serão daqui em diante.

Veja abaixo tudo o que é preciso saber sobre o uso do WP Rocket na Kinsta e como esta pode ser uma ótima combinação para você e seus clientes.

Usando o WP Rocket na Kinsta

Para aqueles que não estão familiarizados com o WP Rocket, trata-se de um plugin premium completo de cache e otimização para WordPress. Normalmente, não permitimos plugins de cache em nosso ambiente, pois eles entram em conflito com nossa solução embutida de cache. Entretanto, até a versão 3.0 do WP Rocket, a funcionalidade de cache de página será automaticamente desabilitada quando executada nos servidores da Kinsta. Anteriormente, isso precisava ser feito manualmente no módulo de cache de página deles. Também removemos o plugin de nossa lista de ferramentas banidas.

Isso permite que agora você use a solução de cache da Kinsta, mas ainda assim tire vantagem dos incríveis recursos de otimização que o WP Rocket tem a oferecer (falaremos deles mais abaixo).

Por que o cache é importante? Cache é o processo de armazenar recursos de uma solicitação e reutilizá-los para solicitações subsequentes. Basicamente, ele diminui a quantidade de trabalho necessário para gerar uma visualização de página e reduz a carga no servidor web. Essa é a forma número um de impedir o atraso gerado pela dependência do WordPress por PHP e um banco de dados (leia mais sobre WordPress vs HTML estático).

Recursos do WP Rocket 3.0

Se você ainda não viu a nova versão 3.0 do WP Rocket, saiba que a interface de usuário é linda e permanece fácil de usar e navegar! Abaixo, vamos nos aprofundar em alguns dos recursos recomendados do WP Rocket que você pode usar para acelerar seu site WordPress, bem como a maneira com a qual ele está sincronizado com o ambiente Kinsta.

Também rodamos alguns testes de velocidade para verificar quais opções apresentarão o maior impacto em sites reais. Lembre-se, no entanto, que os resultados podem variar de site para site, portanto certifique-se de testá-los em seu próprio site ou no ambiente de testes. Se estiver usando um site de testes na Kinsta, saiba que o WP Rocket colocou nossa estrutura de URL na lista de permissões (teste-nomedosite.kinsta.com), o que significa que ele não contará como um site em sua contagem geral de licenças. O mesmo vale para rodar o site no host local

Interface de Usuário WP Rocket

Interface de Usuário WP Rocket

Limpeza de Cache

Mesmo que o cache esteja desabilitado automaticamente no WP Rocket quando ele é executado na Kinsta, a opção “Limpar cache” (“Clean cache”) no menu do plugin é sincronizada com o ambiente Kinsta. Se você limpa seu cache no WP Rocket, na realidade está limpando o cache do seu site inteiro na Kinsta. Legal, certo? E, como sempre, também é possível limpar o cache da Kinsta na parte superior direita na barra de administração.

Limpeza de cache (duas formas)

Limpeza de cache (duas formas)

A opção “Limpar essa URL” (“Purge this URL”) funciona da mesma forma, mas ao invés de fazer a limpeza do cache do seu site inteiro, ela limpa apenas o cache da URL que estiver sendo visitada no momento. Esse é um ótimo recurso caso você tenha feito uma atualização manual em uma página ou post. Por motivos de desempenho, não recomendamos limpar constantemente o cache do seu site inteiro, pois ele teria que ser reconstruído do zero. Limpar URLs individuais é uma forma muito melhor.

Limpeza de cache do WP Rocket em URL individual

Limpeza de cache do WP Rocket em URL individual

Se você alterar algo em seu site WordPress, como um plugin ou tema, talvez receba uma mensagem do WP Rocket. O botão “Limpar cache” (“Clear cache”) exibido aqui também vai limpar o cache da Kinsta.

Limpeza de cache do WP Rocket nas alterações

Limpeza de cache do WP Rocket nas alterações

Por fim, se você clicar no botão “Limpar Cache” (“Clean Cache”) no painel do WP Rocket, também fará a limpeza do cache na Kinsta.

WP Rocket remove todos os arquivos em cache

WP Rocket remove todos os arquivos em cache

Otimização de Arquivos

No menu “Otimização de Arquivos” (“File Optimization”), eles oferecem a capacidade de otimizar seus arquivos CSS e JavaScript. Vamos nos aprofundar um pouco em cada um deles.

Otimização de arquivos no WP Rocket

Otimização de arquivos no WP Rocket

Configurações Básicas

  • Redução de HTML: A redução de HTML remove espaços em branco e comentários para reduzir o tamanho das páginas. Rodamos testes de velocidade e vimos uma queda de 0,84% no tempo de carregamento com essa opção habilitada. ⏱ Você pode não observar melhorias drásticas com esse recurso, mas no geral, quanto menos espaços em branco e código, melhor.
  • Combinar arquivos do Google Fonts:Combinar arquivos do Google Fonts reduz o número de solicitações HTTP. Se você está usando uma hospedagem com HTTP/2 habilitado, não é recomendado combinar arquivos, devido a melhorias com paralelismo. A Kinsta suporta HTTP/2 completamente. Carregar suas fontes em sua própria CDN também pode melhorar o desempenho. Veja nosso guia sobre como hospedar fontes locais.
  • Remover strings de consulta de fontes estáticas: Seus arquivos CSS e JavaScript geralmente apresentam a versão do arquivo ao final de suas URLs, como com/style.css?ver=4.6. Alguns servidores e proxies são incapazes de armazenar strings de consulta em cache, mesmo que um cabeçalho cache-control:publicesteja presente. Portanto, ao removê-los, você pode melhorar seu cache. Rodamos testes de velocidade e vimos uma redução de 1,86% no tempo de carregamento com essa opção habilitada. ⏱ Saiba mais sobre como strings de consulta funcionam. Observação: Você não pode usar esse recurso juntamente com as opções de redução de CSS ou JavaScript.

Arquivos CSS

  • Redução de arquivos CSS: A redução de CSS remove espaços em branco e comentários para reduzir o tamanho do arquivo. Rodamos testes de velocidade e vimos uma redução de 1,69% no tempo de carregamento com essa opção habilitada. ⏱ Devido à forma como CSS funciona, isso pode quebrar seu site, portanto certifique-se de fazer testes. Novamente, em geral, ter menos espaço em branco e código é algo positivo.
  • Combinar arquivos CSS: A combinação de arquivos CSS mescla todos os seus arquivos em um só, reduzindo as solicitações HTTP. Se você está usando uma hospedagem com HTTP/2 habilitado, não é recomendado combinar arquivos, pois eles podem ser carregados em paralelo em uma única conexão. A Kinsta suporta HTTP/2 completamente. Leia mais sobre combinação de CSS externo.
  • Otimizar entrega de CSS: A otimização de entrega de CSS elimina a renderização em blocos de CSS em seu website para apresentar um menor tempo de carregamento. Saiba mais sobre isso em nossos artigos aprofundados sobre renderização em blocos CSS e otimização de caminhos críticos de renderização. Rodamos testes de velocidade e vimos uma redução de 0,17% no tempo de carregamento com esta opção habilitada. ⏱ Lembre-se, no entanto, que se trata mais de tempo de carregamento percebido do que tempo real de carregamento.

Arquivos JavaScript

  • Reduzir arquivos JavaScript:A redução de arquivos JavaScript remove os espaços em branco e comentários para reduzir o tamanho do arquivo. Rodamos testes de velocidade e vimos uma redução de 0,84% no tempo de carregamento com esta opção habilitada. ⏱ Devido à forma como JavaScript funciona, isso poderia quebrar a funcionalidade de seus plugins ou temas, portanto certifique-se de testar. Novamente, quanto menos espaços em branco e código, melhor.
  • Combinar arquivos JavaScript: Essa opção combina os arquivos JS do seu site em arquivos menores, reduzindo as solicitações HTTP. Se você está usando uma hospedagem com HTTP/2 habilitado, não é recomendado combinar arquivos, pois eles podem ser carregados em paralelo em uma única conexão. A Kinsta suporta HTTP/2 completamente.
  • Carregamento JavaScript deferido:O carregamento JavaScript deferido elimina a renderização em blocos JS em seu site e pode melhorar o tempo de carregamento. Leia mais sobre isso em nossos artigos detalhados sobre renderização em blocos JavaScript. Ele pode quebrar seu site se você não for cuidadoso, portanto faça os testes. Rodamos testes de velocidade e vimos uma redução de 1,35% no tempo de carregamento com essa opção habilitada. ⏱

Mídia

No menu “Mídia” (“Media”), eles oferecem a você uma opção de lazy load de suas imagens e vídeos, bem como a possibilidade de desabilitar scripts adicionais de carregarem, como Emojis e Embeds. Vamos abordar em detalhes cada um deles.

Otimização de mídia no WP Rocket

Otimização de mídia no WP Rocket

Lazy Load

Lazy loading é uma técnica de otimização que carrega conteúdo visível, mas atrasa o download e a renderização do conteúdo que aparece abaixo da dobra. Ao habilitar a opção de lazy load, é possível melhorar o tempo de carregamento real e percebido, uma vez que imagens, iframes e vídeos serão carregados somente quando entram (ou estão perto de entrar) na visualização de tela, reduzindo o número de solicitações HTTP.

  • Habilitar para imagens: Rodamos testes de velocidade e vimos uma redução de 3,89% no tempo de carregamento com esta opção habilitada. ⏱
  • Habilitar para iframes e vídeos: Colocamos oito vídeos do YouTube na página e vimos uma redução de 74,43% no tempo de carregamento com esta opção habilitada. ⏱ O WP Rocket tem uma opção para substituir automaticamente um vídeo do YouTube por sua imagem de destaque. Essa é uma forma incrivelmente poderosa de acelerar os vídeos em seu site WordPress.

Veja nosso tutorial detalhado sobre lazy loading no WordPress.

Emojis

O lançamento do WordPress 4.2 veio acompanhado da integração de emojis em seu núcleo para navegadores antigos. A grande questão é que isso gera uma solicitação HTTP adicional em seu site WordPress para carregar o arquivo wp-emoji-release.min.js . E ele é carregado em cada uma das páginas.

Desabilitar Emojis: A opção para desabilitar emojis reduzirá o número de solicitações HTTP. Ela não impedirá que eles sejam usados, apenas os transformará na versão padrão dos emojis do navegador do usuário. Rodamos testes de velocidade e vimos uma redução de 2,2% no tempo de carregamento com esta opção habilitada. ⏱ Veja nosso artigo detalhado sobre desabilitar emojis.

Embeds

O lançamento do WordPress 4.4 veio acompanhado pelo recurso oEmbed em seu núcleo. Você provavelmente já o viu ou usou antes. Ele permite que usuários incluam vídeos do YouTube, tweets e muitos outros recursos em seus sites simplesmente colando uma URL, que é automaticamente convertida em um embed pelo WordPress e que exibe uma prévia em tempo real no editor visual.

Entretanto, isso significa que uma solicitação HTTP adicional também é gerada em seu site WordPress, que agora carrega o arquivo wp-embed.min.js.

Desabilitar embeds no WordPress: A opção para desabilitar embeds reduz o número de solicitações HTTP. Rodamos testes de velocidade e vimos uma redução de 4,9% nos tempos de carregamento com esta opção habilitada. ⏱ Veja nosso artigo detalhado sobre desabilitar embeds.

Pré-carregamento

No menu “Pré-carregamento” (“Preload”) eles oferecem a opção de habilitar o pré-carregamento de sitemaps, robôs e busca prévia de solicitações DNS. Nem todos eles funcionarão na Kinsta. Mas vamos nos aprofundar em cada um deles.

Pré-carregamento no WP Rocket

Pré-carregamento no WP Rocket

Pré-carregamento de Sitemaps e Robôs

Não recomendamos usar nenhuma dessas opções e, na verdade, elas provavelmente não funcionarão na Kinsta.

Busca Prévia de Solicitações DNS

A busca prévia de DNS permite que você resolva nomes de domínio (desempenhe uma pesquisa DNS no plano de fundo) antes que um usuário clique em um link, o que por sua vez ajuda a melhorar o desempenho. Isso é feito através da adição de uma tag rel="dns-prefetch" no cabeçalho do seu site WordPress. Recomendamos que adicione a busca prévia para solicitações externas de sua CDN, Google Fonts e Google Analytics. Aqui está um exemplo:

<link rel="dns-prefetch" href="//cdn.domain.com/">
<link rel="dns-prefetch" href="//fonts.googleapis.com/">
<link rel="dns-prefetch" href="//www.google-analytics.com">

É mais difícil de testar a velocidade nesse caso, mas você pode ficar tranquilo, pois isso ajudará a acelerar seu site.

Regras Avançadas

Devido ao fato de o WP Rocket funcionar sincronizado com o cache do ambiente da Kinsta, você não pode usar regras avançadas. Se precisa excluir uma URL ou diretório do armazenamento em cache, entre em contato com a equipe de suporte da Kinsta.

Banco de Dados

No menu “Banco de Dados” (“Database”) eles oferecem a possibilidade de realizar limpezas em posts, comentários, transientes e tabelas.

Banco de dados no WP Rocket

Banco de dados no WP Rocket

Limpeza de Posts

Não é incomum que sites mais antigos tenham mais de 100 revisões em suas páginas principais. Isso é decorrente de anos de edições e atualizações no conteúdo. Por exemplo, digamos que um site tenha 700 páginas ou posts com 150 revisões em cada um. Isso resultaria em mais de 100 mil entradas no banco de dados. Elas ocupam espaço de armazenamento e, mesmo com índices no banco de dados, podem prejudicar o desempenho. O WP Rocket oferece a você a opção de remover:

  • Revisões
  • Rascunhos automáticos
  • Posts excluídos

Veja nosso post detalhado sobre como otimizar revisões para um desempenho mais rápido.

Limpeza de Comentários

Similarmente às revisões, os spam e comentários excluídos podem simplesmente acumular e desperdiçar espaço ao longo do tempo. O WP Rocket te dá a opção de remover:

  • Spam
  • Comentários excluídos

Se você não está usando comentários em seu site WordPress, recomendamos que simplesmente os desabilite para prevenir que spams cheguem. Assim, você também não precisaria se preocupar em instalar plugins para cuidar deles.

Lutando com tempo de inatividade e problemas no WordPress? Kinsta é a solução de hospedagem projetada para economizar seu tempo! Confira nossos recursos

Limpeza de Transientes

Por vezes, os transientes no WordPress são ignorados, mas eles são muito importantes! Na verdade, já vimos cache transiente corrompido derrubar completamente um site WordPress. Eles devem ser temporários, por isso é seguro removê-los e é exatamente o que recomendamos que seja feito. Se eles forem necessários para um plugin, serão regenerados automaticamente. O WP Rocket te dá a opção de excluir:

  • Transientes expirados
  • Todos os transientes

Limpeza de Banco de Dados

A opção de limpeza de banco de dados reduz a sobrecarga de tabelas do banco de dados. Entretanto, usamos InnoDB na Kinsta, ao invés de MyISAM e, portanto, ela geralmente não é necessária. InnoDB demonstrou um desempenho melhor e mais confiável. Uma grande razão para usar InnoDB ao invés de MyISAM é aproveitar o bloqueio de linhas. Isso permite que suas consultas sejam processadas mais rapidamente. Se você fizer a migração do seu site para a Kinsta, essa é uma das otimizações que nossos engenheiros farão em seu site.

Limpeza Automática

O WP Rocket também oferece a opção para agendar uma limpeza automática em seu banco de dados, que pode ser diária, semanal ou mensal. O agendamento é feito através de um CRON job nos bastidores.

CDN

No menu “CDN”, você pode habilitar uma rede terceirizada de entrega de conteúdo. Essa é uma opção indispensável quando se trata de desempenho. Ela tira a carga do seu servidor web ao mesmo tempo em que acelera a entrega do conteúdo para seus visitantes, tornando sua experiência ainda melhor. Veja por que acreditamos que todo site deveria usar uma CDN.

Se você é um cliente Kinsta, este menu não será necessário, uma vez que a CDN Kinsta é automaticamente implementada em seu site. Entretanto, notamos que em alguns sites talvez seja necessário inserir sua URL da CDN Kinsta quando o WP Rocket está habilitado. Recomendamos rodar seu site primeiramente através de uma ferramenta de teste de velocidade para confirmar que todos os seus ativos (JS, CSS e imagens) estão carregando a partir da CDN Kinsta. Se não estiverem, tente inserir sua URL da CDN Kinsta manualmente (por exemplo: mk0dgs321g.kinstacdn.com).

CDN no WP Rocket

CDN no WP Rocket

Complementos

No menu “Complementos” (“Add-Ons”), eles oferecem a capacidade de habilitar Cloudflare. Se você usa o complemento WP Rocket Cloudflare, não precisa mais do plugin Cloudflare oficial. O WP Rocket oferece a mesma funcionalidade de fornecer endereços IP de origem.

Complementos no WP Rocket

Complementos no WP Rocket

Se você está usando WP Rocket com outro provedor de hospedagem, também terá a opção de habilitar o Varnish. Entretanto, como isso criaria um conflito com nossa solução de cache aqui na Kinsta, ele permanece automaticamente oculto.

Testes de Velocidade Final ⏱

Em seguida, rodamos alguns testes de velocidade final com tudo habilitado, para analisarmos a comparação entre antes e depois. Observação: Este site WordPress está hospedado na Kinsta.

Antes do WP Rocket

Rodamos cinco testes no Pingdom sem o WP Rocket e extraímos a média.

Antes do WP Rocket

Antes do WP Rocket

Na sequência, rodamos um teste no Google PageSpeed Insights sem o WP Rocket.

Google PageSpeed Insights antes do WP Rocket

Google PageSpeed Insights antes do WP Rocket

Após o WP Rocket

Realizamos mais cinco testes no Pingdom com o WP Rocket e suas opções ativadas e extraímos a média.

Com WP Rocket

Com WP Rocket

Em seguida, fizemos um teste no Google PageSpeed Insights com o WP Rocket.

Google PageSpeed Insights com WP Rocket

Google PageSpeed Insights com WP Rocket

Aqui está a conclusão dos resultados acima:

  • Em nossos testes no Pingdom, observamos uma redução de 9,12% no tempo total de carregamento quando rodamos o WP Rocket. Embora esse número não pareça tão alto, levou apenas alguns minutos e menos de dez cliques para alcançá-lo.
  • Lembre-se que o feijão com arroz do WP Rocket é a solução de cache. Mas aqui em Kinsta já usamos nosso cache embutido, portanto estamos apenas compartilhando os resultados obtidos com os demais recursos de otimização. Então, se trata de uma melhoria real de 9% sobre o cache veloz da Kinsta. ⚡
  • O site que utilizamos para o teste já estava bastante otimizado. Sites maiores e aqueles que não são tão otimizados apresentarão resultados ainda melhores.
  • Curioso para saber por que há solicitações adicionais na versão final? Isso geralmente ocorre devido ao recurso de lazy loading nas imagens, uma vez que ele cria solicitações data:image/gif;base64em branco. Mas não se preocupe, o site ainda assim será mais rápido.
  • Se você estiver hospedando vídeos, provavelmente observará reduções no tempo de carregamento de 50% ou mais. Isso é alcançado ao utilizar o recurso do WP Rocket que substitui vídeos do YouTube por miniaturas com prévias que podem ser clicadas. É algo muito conveniente!
  • Em nossos testes no Google PageSpeed Insights, vimos um aumento em nossa pontuação de 88/100 para 98/100. Entretanto, as pontuações não são tão importantes quanto o tempo geral de carregamento, portanto considere-as com cautela. Discutimos isso em nosso artigo sobre o Google PageSpeed Insights.

Conforme você pode observar acima, o WP Rocket torna incrivelmente fácil acelerar seu site com apenas alguns cliques!

Resumo

A equipe do WP Rocket lança constantemente novos recursos que se alinham diretamente com as recomendações de desempenho na web que fazemos na Kinsta. Espere ver uma integração ainda mais próxima com o plugin nos próximos meses! Estamos animados em saber que os clientes agora são capazes de usar este plugin sem precisar de qualquer modificação adicional.

Adoraríamos ouvir o que você tem a dizer. Você usa o WP Rocket? Compartilhe conosco nos comentários abaixo.

5
Shares