Como eliminar recursos de bloqueio de renderização no WordPress (muito fácil)

Recursos de bloqueio de renderização podem ser um grande problema para os blogueiros. O Google continua avisando para eliminá-los. Existem muitas maneiras de removê-los, mas aqui está uma maneira muito simples que não requer codificação.

Ter um blog ou site rápido é muito importante. É importante se você deseja ter uma classificação alta nos mecanismos de pesquisa. Se o seu site for muito lento, certamente prejudicará seu SEO.

Além disso, um site lento pode aumentar a taxa de rejeição, o que tecnicamente prejudicará sua marca de várias maneiras. Um site lento pode afetar a receita e a conversão.

A maioria dos usuários é impaciente, se o seu site demorar muito para carregar, eles o abandonarão e passarão para uma alternativa mais rápida. Esse é um potencial cliente ou impulsionador de receita que se foi.

Se você está tentando acelerar seu site e usa uma ferramenta de teste como o Google PageSpeed ​​Insight, um aviso que você provavelmente receberá é eliminar os recursos de bloqueio de renderização.

Neste artigo, você aprenderá como eliminar recursos de bloqueio de renderização facilmente.

O que são recursos de bloqueio de renderização?

Os recursos de bloqueio de renderização são CSS e JavaScript que retardam o tempo de carregamento de um site porque ele precisa ser baixado pelo navegador da Web antes que o conteúdo da página possa ser renderizado.

Quando um visitante tenta acessar um site, o navegador começa imediatamente a ler o site de cima para baixo. Se houver algum CSS ou JavaScript, o navegador parará de ler até baixar e processar os arquivos. Antes que o navegador possa renderizar o conteúdo acima da dobra, ele precisa baixar os arquivos CSS ou JavaScript.

Plugins ou temas que você instala podem adicionar alguns desses CSS e JS. Alguns não precisam carregar primeiro, podem carregar depois. Mas porque eles estão lá no topo, eles tornam seu site mais lento.

Então, o que o Google quer dizer com “eliminar recursos de bloqueio de renderização” é que você remove recursos desnecessários do topo do seu site porque isso diminui o carregamento do conteúdo do site.

Como encontrar recursos de bloqueio de renderização

Antes de resolver um problema de bloqueio de renderização, você precisa saber de onde ele vem. Você pode descobrir quais recursos estão bloqueando a renderização executando um teste em Google PageSpeed ​​Insight or Web.Measure.

Você pode seguir as etapas abaixo para encontrar recursos de bloqueio de renderização:

1. Visita Google PageSpeed ​​Insight

2. Digite o endereço do seu site e clique em analisar

3. Role para baixo e procure pelo aviso de eliminar recursos de bloqueio de renderização.

Verifique se há toque no celular e no desktop.

Área de trabalho do PageSpeed ​​Insight
Para BloggingTools, temos 100 na área de trabalho, felizmente não temos problema de bloqueio de renderização

Para se qualificar para o Ferramentas de blog, não temos problemas de bloqueio de renderização para desktop, mas temos para dispositivos móveis. Então, para isso, usaremos o Mobile, como você pode ver abaixo.

Pontuação do PageSpeed ​​Insight para celular
PageSpeed ​​Insight para dispositivos móveis
Temos 2 problemas para celular

Para dispositivos móveis, como você pode ver acima, temos 2 problemas de bloqueio de renderização. Com uma pontuação de 93. A pontuação foi maior, mas por causa deste post, tive que desativar o plugin Autoptimize.

O BloggingTools.org alcançou essa pontuação sem otimização porque estamos usando um tema muito rápido e leve chamado GeneratePress. Também estamos hospedando em um host muito rápido conhecido como Cloudways.

Nota: você não deve ficar obcecado em obter 100 na pontuação de insights do PageSpeed. É apenas um guia. Normalmente, uma pontuação média de 65 a 80 é boa para a maioria das pessoas. Não remova arquivos essenciais para o seu negócio.

O bom do WordPress é que você não precisa fazer tudo manualmente. Existem alguns plugins bem codificados para ajudar.

Como corrigir eliminar o problema de recursos de bloqueio de renderização no WordPress

Siga estas etapas para corrigir o problema de recursos de bloqueio de renderização:

1. Instale e ative o Autoptimize

Existem muitos plugins do WordPress que podem fazer isso, como cache total W3, WP Rocket e assim por diante. Mas pela minha experiência com muitos sites, o Autoptimize sempre lida com isso muito melhor do que qualquer um deles. O maravilhoso é que o Autoptimize é compatível com quase todos os plugins de cache do WordPress e é gratuito.

Vá até o diretório de plugins do WordPress para instalar e ativar o Autoptimize

2. Visite as configurações de otimização automática

Se você precisar onde encontrar as configurações do Autoptimize, no painel do WordPress, clique em configurações e clique em Autoptimize.

3. Otimize o JavaScript

Em opções de JavaScript, selecione Otimizar código de script e também selecione arquivos JS agregados. Você pode encontrar as configurações que estou usando para BloggingTools abaixo.

Otimização automática de JavaScript

4. Otimize o CSS

Nas opções Otimizar CSS, selecione Otimizar código CSS. Selecione também arquivos CSS agregados e “Também CSS inline agregado”. Veja as opções que estou usando para BloggingTools abaixo.

Otimização automática de CSS

5. Otimize o HTML

Se você deseja um melhor desempenho, também pode usar o Autoptimize para otimizar o HTML. Em Opções de HTML, selecione otimizar código HTML. Você pode ver as configurações que estou usando para BloggingTools abaixo.

Otimização automática de HTML

6. Verifique as opções diversas

Você pode verificar as opções diversas e ajustar algumas configurações conforme funciona para você. Você pode encontrar as configurações do BloggingTools abaixo.

Opções diversas de otimização automática

7. Salve e esvazie o cache.

Em seguida, basta clicar em Salvar e esvaziar o cache. Isso é tudo!

Depois de tudo isso, você pode verificar seu site novamente no Google PageSpeed ​​Insight. Para o BloggingTools, imediatamente após fazer isso, nossa pontuação saltou para 95 e todos os avisos de eliminação de recursos de bloqueio de renderização desapareceram completamente. Veja abaixo.

Google PageSpeed ​​Insight para celular
Pontuação para dispositivos móveis do Google PageSpeed ​​Insight

Observe que, dependendo de quantos recursos de bloqueio de renderização você possui e de quão cruciais eles são para o seu site, alguns deles podem permanecer. Não tente removê-los.

Se você quiser eliminar ainda mais, você pode usar JavaScript assíncrono, um plugin do mesmo autor que Autoptimize. Eles trabalham juntos. Eu não recomendo isso, pois pode quebrar seu site. A otimização automática por si só está bem!

Conclusão

A velocidade é importante e eliminar recursos de bloqueio de renderização pode ajudar seu site a carregar mais rápido e dar ao seu site uma pontuação melhor nas ferramentas de teste de velocidade. Mas você nunca deve ficar obcecado por essas pontuações, pois elas existem apenas para orientar.

Se o seu site ainda estiver muito lento depois disso. Os três problemas mais prováveis ​​​​podem ser que seu tema ou seu host da Web seja ruim ou você tenha plugins ruins instalados. Eu recomendo Coudways como o melhor host e GeneratePress como o melhor tema. Se você é um iniciante, Bluehost pode lidar, mas se você puder pagar, Cloudways é o melhor. Você pode começar de graça. Eu uso GeneratePress e Coudways para TargetTrend

Veja também:

Como tornar o WordPress muito rápido

Como direcionar o tráfego para o seu blog

Como ganhar dinheiro blogando

Como começar um blog

Mfon Abel Ekene

Mfon Abel Ekene

Gosto de criar conteúdos que sejam úteis. Minha paixão é ajudar a população da internet a encontrar o que precisa, apontando-os na direção certa. É o que eu amo fazer e eu coloco muitas horas de pesquisa e testes para garantir que eu faça exatamente isso através do meu conteúdo no TargetTrend.

Artigos: 50

Receba materiais tecnológicos

Tendências de tecnologia, tendências de inicialização, análises, renda online, ferramentas da web e marketing uma ou duas vezes por mês

Deixe um comentário

O seu endereço de e-mail não será publicado.