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

Page 1

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.

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 e é possível conseguir? Antes de passarmos, devemos saber o qual é o nosso objetivo e o diz 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? 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. 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. http://blogmarketingonline.com.br/dica-como-eliminar-javascript-e-css-debloqueio-de-renderizacao/


Turn static files into dynamic content formats.

Create a flipbook
Issuu converts static files into: digital portfolios, online yearbooks, online catalogs, digital photo albums and more. Sign up and create your flipbook.