Dica como eliminar javascript e css de bloqueio de renderização

Se você já usou o Google Pagespeed, na maioria dos casos, você verá uma sugestão que você deve eliminar javascript e css de bloqueio de renderização no conteúdo acima da borda. Veja como resolver.

eliminar-javascript-e-css-de-bloqueio-de-renderização

Como eliminar javascript e css de bloqueio de renderização

Isto é o que diz o Google para Javascript:

Antes que um navegador possa processar uma página para o usuário, tem que analisar a página. Se encontrar um script externo ou bloqueio durante a análise, tem que parar e baixar esse Javascript. Cada vez que ele faz isso, está adicionando uma rede de ida e volta, que vai atrasar o tempo para primeira renderização da página.

Isto é o que diz o Google para CSS:

Esta regra acionada quando PageSpeed Insights detecta que uma página inclui processamento de folhas de estilo externas, que atrasa o conteúdo e causa esse bloqueio.

Nem sempre é fácil ou prático corrigir esse problema ou não sabe como eliminar javascript e css de bloqueio de renderização o que não é prático na maioria dos casos, como a maioria dos usuários WordPress não é programador fica ainda mais perdido sem ter ideia do que fazer.

Então, qual é a solução?

1. fazer o que o Google diz.
2. carrega os arquivos de forma assíncrona.

Qual é o objetivo de eliminar javascript e css de bloqueio de renderização?

Antes de passarmos, devemos saber o qual é o nosso objetivo e o que diz essa mensagem do google. Como eu disse acima o google quer conteúdo acima da dobra e deve mostrar ao usuário sem ter que esperar por esses arquivos serem baixados, que o objetivo é reduzir o tempo de espera. Lembre-se que o objetivo é reduzir o tempo de espera, e não para obter uma melhor pontuação no Pagespeed.

Lembre-se sempre se trata de melhorar a experiência do usuário.

É possível eliminar javascript e css de bloqueio de renderização no conteúdo acima da borda wordpress?

Sim, e se você deseja reduzir o tempo de espera, mas no caso se você deseja melhorar junto ao site pagespeed depende de alguns fatores.

Eliminar o bloqueio de render JavaScript e CSS acima da borda do conteúdo usando plugin Speed Booster Pack

    1. Instale o plugin “Speed Booster Pack” no WordPress.
    2. Agora navegue até Configurações > abra o speed booster pack
    3. Na parte superior em general options marque as seguintes opções: Move scripts to the footer e defer parsing of javascript files.
    4. Agora mais abaixo clique na opção: Still need more speed e marque a opção Load CSS asynchronously (habilitar) a opção “carregar o CSS de forma assíncrona”, vai remover o erro da parte do CSS.
    5. Tem outras opções nesse plugin se precisar usar para melhorar o desempenho faça testes e verifique.

Se estiver precisando de um plugin para otimização de imagens indico a leitura do artigo 17 dicas de como fazer um blog mais rápido.

Existe um outro plugin, porém esse não é atualizado + de 2 anos “Async JS e CSS configurações“. Mas lembre-se que não esta sendo mais atualizado ainda pode testar.

Configurações para o plugin:

1.Load Javascript Asynchronously: Enable
2.Detect <script> tags in wp_head: Disable
3.Detect <script> tags in wp_footer: Disable
4.Load CSS asynchronously: Enable
5.CSS loading method: Leave as it is
6.Minify CSS: Enable
7.Remove “?ver=XXX” part from URLs: Enable

Após feito um dos procedimentos muitos tem o conceito que vai melhorar a pontuação no site Pagespeed, porém não é esse o conceito e sim melhorar a experiência do usuário final é para melhorar a velocidade e o tempo de um site na hora de carregar.

Existem muitos casos que a mensagem deixa louco e não percebe que as vezes o que esta causando essa mensagem é algum banner de afiliado que esta usando já passei por isso e agora você entendeu que não é complicado remover os javascript de bloqueio de processamento.

Tem pessoas pirando com os alertas do Pagespeed de como eliminar javascript e css de bloqueio de renderização eu já passei dessa fase hoje eu fico mais preocupado com o Search Console e o Google Analytics.

Agora você tem ideia de como eliminar javascript e css de bloqueio de renderização wordpress e alguns casos pode ser que não funcione 100% por depender de outros fatores.

Dica como eliminar javascript e css de bloqueio de renderização
3.9 (78.82%) 17 votes
-->Aproveite e cadastre seu email abaixo para receber novas atualizações do site. Após colocar o seu email abaixo vai receber um email de confirmação de cadastro não esqueça de clicar.<--

Receba novidades no seu email:

Delivered by FeedBurner

16 Comentários

  1. Valdeci julho 2, 2016
    • Claudio Gomes julho 2, 2016
  2. Adilson Rodrigues julho 22, 2016
    • Claudio Gomes julho 23, 2016
  3. Anderson Ferro setembro 21, 2016
    • Claudio Gomes setembro 21, 2016
  4. Pedro Revendas setembro 29, 2016
    • Claudio Gomes setembro 30, 2016
  5. erick outubro 26, 2016
    • Claudio Gomes outubro 26, 2016
      • erick outubro 26, 2016
  6. KLEBSON dezembro 5, 2016
  7. Aparecido janeiro 11, 2017
    • Claudio Gomes janeiro 11, 2017
  8. Anderson Carvalho março 23, 2017
  9. Fábio abril 19, 2017

Deixe uma resposta

Digite abaixo a numeração *