como melhorar a velocidade do WordPressque farão seu site ficar até 300x mais rápido. Tais técnicas não são avançadas e mesmo assim muitos sites não as utilizam. Se você aplicar 70% do que é mostrado aqui você terá um ganho de performance surpreendente em seu site wordPress.
Como melhorar a velocidade do wordpress
- Escolha um bom tema que já esteja otimizado para performance
- Utilize Cache
- Utilize CDN
- Otimize seu banco de dados
- Otimize as imagens
- Faça compressão com GZIP
- Reduza o número de plugins
- Otimize suas fonts
- Otimize seus ícones
- Faça lazy load das imagens vídeos e outros
- Minifique e concatene o CSS e JS
- Reduza o https request
- Desabilite o Hotlink
- Desabilite os pingbacks e trackbacks
- Especifique as dimensões das imagens
- Ajuste o ajax do wp-admin
- Otimize o seu MYSQL
- Escolha uma excelente empresa de hospedagem para wordpress
1 Escolha o tema já otimizado para performance e SEO
Escolher um bom tema para wordpress é uma arte, mas não se preocupe neste post você verá quais critérios utilizamos para escolher um bom tema que já venha otimizado para performance e SEO. Primeiro você irá acessar o site da ThemeForest Clique na aba WordPress > Popoular itens, aqui estão os temas mais utilizados por todos os clientes. Os 5 primeiros temas listados são 100% otimizados para performance.5 Melhores temas para wordpress
- AVADA (Conheça o nosso curso de avada )
- Theme X
- Betheme
- Enfold
- Bridge
2 – Utilize um bom plugin de cache para wordpress
Utilizar um bom plugin de cache fará seu site carregar muito mais rápido. Existe diversas boas opções de plugins de cache para wordpress, mas nós da Escola Ninja WordPress recomendamos 3.3 melhores plugins de cache para wordpress
- WP Rocket (Nosso preferido)
- W3 total cacheF
- Wp Super cache
3 – Utilize um bom CDN
Recomendamos fortemente a utilização de um serviço de CDN para melhorar a velocidade do seu site wordpress. O CloudFlare é um excelente CDN gratuito para você começar a utilizar. Veja nosso vídeo como configurar o CloudFlare.
4 – Otimize o banco de dados do WordPress
Veja o vídeo abaixo onde nosso especialista em WordPress explica porque se deve otimizar o banco de dados do wordPress.Plugins wordpress para otimizar o banco de dados
- WP Rocket
- WP Optmize
4 Ferramentas para otimização de imagens
- Riot
- Wp Smush (Versão free é limitada a 2 MB e 50 imagens por vez, já a versão paga não há restrinções)
- Ewww
- Tiny Png
6 – Habilite a compressão GZIP
Compressão GZIP significa entregar os arquivos do seu site comprimidos para o navegador. A partir de testes realizados por empresas de performance como Ping dom e webpagetest constatou-se que habilitar a compressão pode economizar de 50% a 80% de largura de banda do seu site. Para saber se o seu site esta com o GZIP habilitado basta acessar o site https://checkgzipcompression.com/. Caso o seu site não esteja com o GZIP habilitado, entre em contato com o seu servidor de hospedagem e peça para eles habilitarem o GZIP para você. Se você utiliza um servidor com APACHE copie e cole o código abaixo em seu arquivo .htaccess<IfModule mod_deflate.c> # Compress HTML, CSS, JavaScript, Text, XML and fonts AddOutputFilterByType DEFLATE application/javascript AddOutputFilterByType DEFLATE application/rss+xml AddOutputFilterByType DEFLATE application/vnd.ms-fontobject AddOutputFilterByType DEFLATE application/x-font AddOutputFilterByType DEFLATE application/x-font-opentype AddOutputFilterByType DEFLATE application/x-font-otf AddOutputFilterByType DEFLATE application/x-font-truetype AddOutputFilterByType DEFLATE application/x-font-ttf AddOutputFilterByType DEFLATE application/x-javascript AddOutputFilterByType DEFLATE application/xhtml+xml AddOutputFilterByType DEFLATE application/xml AddOutputFilterByType DEFLATE font/opentype AddOutputFilterByType DEFLATE font/otf AddOutputFilterByType DEFLATE font/ttf AddOutputFilterByType DEFLATE image/svg+xml AddOutputFilterByType DEFLATE image/x-icon AddOutputFilterByType DEFLATE text/css AddOutputFilterByType DEFLATE text/html AddOutputFilterByType DEFLATE text/javascript AddOutputFilterByType DEFLATE text/plain AddOutputFilterByType DEFLATE text/xml # Remove browser bugs (only needed for really old browsers) BrowserMatch ^Mozilla/4 gzip-only-text/html BrowserMatch ^Mozilla/4.0[678] no-gzip BrowserMatch bMSIE !no-gzip !gzip-only-text/html Header append Vary User-Agent </IfModule>
7 – Reduza o número de Plugins em seu site
Utilize o plugin P3 para analisar quais plugins estão consumindo recursos do seu site, provavelmente estes plugins estão deixando seu site um pouco mais lento em algumas operações. Após descobrir quais plugins estão deixando seu site lento considere a troca do mesmo por outro e faça o teste novamente. Após corrigir o problema desinstale o plugin P3 pois ele é um plugin bem pesado para ficar instalado em seu site. Página do plugin P3https://br.wordpress.org/plugins/p3-profiler/
8 – Otimize suas fonts
O maior erro no desenvolvimento de um web site é a falta de comunicação entre o desenvolvedor e o designer. Essa comunicação permite alerta os designers da importância de utilizar o mínimo possível de fonts, pois isso impacta diretamente na performance de um projeto.
Procure usar fontes nativas. Use Google Fonts com moderação, pois essas causam uma grande lentidão no seu web site.
Para otimizar as Fonts externas do seu site, recomendamos utilizar o plugin WP Rocket que já foi falado muitas vezes neste post.
O plugin WP Rocket possui uma configuração especial para otimização de Fonts do Google. Então se você utiliza muitas fonts tenho certeza que este plugin vai ser uma mão na roda para você.
Se você quer aprofundar seu conhecimento com o plugin WP Rocket, não deixe conferir o nosso curso de performance para WordPress da Escola Ninja WordPress.
9 – Otimize os ícones do seu site
Ícones são sempre legais de serem usados, eles dão uma boa usabilidade quando seu papel é indicar alguma ação no site.
O que muita gente não sabe é que os ícones (com carregamento em servidores externos) também causa perda de performance pois em sua grande maioria estamos buscando os ícones em repositórios externos. Se você é aluno da Escola Ninja WordPress provavelmente fez nosso curso de performance para wordpress e sabe que o número de requisições que o navegador faz para buscar os arquivos do seu site impactam diretamente no desempenho do seu site ou seja Google fonts, ícones, caixinhas do Facebook, Instagram etc, etc, tudo que é buscado de font diferente externa fará o seu site mais lento. E talvez não precisa nem dizer que o Google usa o tempo de carregamento como fator de ranqueamento, ou seja, quanto mais rápido o seu site carrega melhor para os negócios.
10 – Faça lazy load das imagens vídeos e outros
Lazy Load é a técnica utilizada para carregar informações sobre demanda. Ou seja, o seu usuário só verá aquela imagem bonitinha que está lá no rodapé do seu site quando ele rolar a pagina até lá, se ele não o fizer a imagem ficará em um estado de não carregamento. Os navegadores são inteligentes suficiente para saber quando um objeto esta em estado de aguarde eles só irão mostrar quando de fato o usuário solicitar isso através da barra de rolagem. Você pode fazer Lazy load de imagens, vídeos entre outros. O plugin que recomendo para realizar esse procedimento é o WP Rocket. Esse plugin faz isso de forma incrível. Com ele é possível escolher as páginas que você não quer fazer lazy load, basta acessar a página em questão e desmarcar as opções de lazy load que o plugin disponibiliza.
11 – Minifique os arquivos JS e CSS
Minificar é a técnica para tornar arquivos menores. Existem diversas ferramentas na internet para minificação como jscompress e o cssminifier. Estas fazem o trabalho de minificação de forma online, porém como estamos falando de WordPress essas ferramentas não são tão úteis. A ferramenta que você pode utilizar para estes casos são:- WP Rocket (A melhor)
- W3 total cache
12 – Reduza as requisições https
Reduzir o número de requisições https é um passo muito importante para melhorar a performance do seu site WordPress. Utilize o script abaixo que foi desenvolvido pela equipe o KEYCDN uma empresa de referência em CDN. Este código irá desabilitar algumas funções desnecessárias do WordPress e com isso reduzirá o número de requisições https./**
* Disable the emoji's
*/
function disable_emojis() {
remove_action( 'wp_head', 'print_emoji_detection_script', 7 );
remove_action( 'admin_print_scripts', 'print_emoji_detection_script' );
remove_action( 'wp_print_styles', 'print_emoji_styles' );
remove_action( 'admin_print_styles', 'print_emoji_styles' );
remove_filter( 'the_content_feed', 'wp_staticize_emoji' );
remove_filter( 'comment_text_rss', 'wp_staticize_emoji' );
remove_filter( 'wp_mail', 'wp_staticize_emoji_for_email' );
add_filter( 'tiny_mce_plugins', 'disable_emojis_tinymce' );
}
add_action( 'init', 'disable_emojis' );
/**
* Filter function used to remove the tinymce emoji plugin.
*
* @param array $plugins
* @return array Difference betwen the two arrays
*/
function disable_emojis_tinymce( $plugins ) {
if ( is_array( $plugins ) ) {
return array_diff( $plugins, array( 'wpemoji' ) );
} else {
return array();
}
}
Caso você queira algo mais fácil, recomendo o plugin Gonzales. Esse é um plugin Premium para WordPress que dará a você total autonomia para gerenciar os scrips que são carregados em suas páginas. Só lembrando que o plugin Gonzales está em nosso curso de performance para wordpress, confere lá.
13 – Desabilite os Hotlinks
Hotlinks é quando alguém copia a URL da sua imagem e utiliza em seu web site. Imagine se 100 pessoas diferentes copiarem as urls das suas imagens e utilizarem em seu web site? O que irá acontecer? Irá acontece que toda vez que alguém acessar o site dessas pessoas o processamento será feito no seu servidor e não no servidor da outra pessoa. Você não quer isso né? Você pode bloquear o uso de suas imagens utilizando o código abaixo em seu arquivo .htaccessRewriteCond %{https_REFERER} !^$ RewriteCond %{https_REFERER} !^https(s)?://(www.)?yourdomain.com [NC] RewriteRule .(jpg|jpeg|png|gif)$ – [NC,F,L]
Basta copiar e colar.
14 – Desabilite Pingbacks e Trackbacks
Pingbacks é um recurso nativo do wordpress que te avisa quando alguém fala sobre o seu site em outro lugar da internet. O problema disso é que o seu servidor precisa ficar sempre com o radar ligado para saber se alguém esta falando de você. O que isso gera? Processamento desnecessário em seu servidor pois você poderia utilizar outras ferramentas como Google Alerts para fazer a mesma coisa e tirar esse peso das costas do seu servidor. Com isso você enomizaria algumas bandas de processamento. Então caso você queira desabilitar basta você ir até as configurações do seu wordpresss > configurações de discussão e desmarcar essas 2 opções conforme a imagem abaixo
15 – Especifique as dimensões das imagens
Além de otimizar suas imagens para deixar elas mais leves para o navegador e para o usuário você precisa também especificar as dimensões de largura e altura da imagem. Isso fará com o que o navegador saiba o tamanho exato da imagem que ele precisa “desenhar” caso contrario ele terá que descobrir qual é o tamanho da sua imagem e como você sabe isso gera perda de performance. Então toda vez que você utilizar uma imagem em seu site não esqueça de especificar o tamanho de width e height das imagens.
16 – Ajuste o wp-ajax do wordpress
Utilize o plugin Heartbeat Control que está disponível no repositório do wordpress para reajustar suas configurações do ajax do php. É um plugin simples mas que fará sua administração do wordpress ficar muito mais rápido.
17 – Otimize o seu MYSQL
Verifique com sua hospedagem a possibilidade da otimização do MYSQL do servidor através da técnica MySQL Tuning. Caso seja possível seu site ficará um pouco mais rápido ao realizar as consultas do wordpress