PageSpeed do Google

24/11/2016

1

Fala galera, vocês conhecem essa ferramenta?
Ela ajuda bastante na otimização das pagina do site, porem to com dificuldades em uma validação que ele diz possível melhorar "Eliminar JavaScript e CSS de bloqueio de renderização no conteúdo acima da borda" não to entendendo muito bem.. Alguem sabe do que se trata?
Responder

Post mais votado

25/04/2017

Fala Pedro, beleza brother?

Cara isso é uma batalha constante com o PageSpeed, hahaha

"Eliminar JavaScript e CSS de bloqueio de renderização no conteúdo acima da borda"

No caso eliminar o conteúdo da borda é você remover todos os includes css e js que ficam acima da tag body, pois Page Speed, considera que você primeiro deve carregar todo o html que é parte estrutural do seu site, para depois carregar os demais scripts.



Com os arquivos JS o melhor a se fazer é realmente inserir o conteúdo abaixo do footer, porem com o css não temos como fazer tal implementação :(



Temos um DevCast falando exatamente sobre essa questão: www.devmedia.com.br/como-otimizar-suas-paginas-web-com-pagespeed/38053
Depois dá uma olhada, forte abraço!
Responder

Mais Posts

02/05/2017

Samuel Vicente

Haha, vou apenas reforçar o que o Gaspar disse.

De fato é uma batalha constante com o PageSpeed. Apesar de eu não ser desenvolvedor, entendo um pouco de JavaScript.

Os desenvolvedores que trabalham comigo reclamam bastante desse item em particular que o PageSpeed aponta.

A orientação que o próprio PageSpeed dá deve te ajudar a resolver esse problema.
Responder
Ótimas respostas! Nem precisa complementar!

Ficou esclarecido Pedro?
Responder

25/07/2017

Calebe Menezes

Fala Pedro, beleza brother?

Cara isso é uma batalha constante com o PageSpeed, hahaha

"Eliminar JavaScript e CSS de bloqueio de renderização no conteúdo acima da borda"

No caso eliminar o conteúdo da borda é você remover todos os includes css e js que ficam acima da tag body, pois Page Speed, considera que você primeiro deve carregar todo o html que é parte estrutural do seu site, para depois carregar os demais scripts.



Com os arquivos JS o melhor a se fazer é realmente inserir o conteúdo abaixo do footer, porem com o css não temos como fazer tal implementação :(



Temos um DevCast falando exatamente sobre essa questão: www.devmedia.com.br/como-otimizar-suas-paginas-web-com-pagespeed/38053
Depois dá uma olhada, forte abraço!



Concordo com o Fernando!
Responder
Fala Pedro, beleza brother?

Cara isso é uma batalha constante com o PageSpeed, hahaha

"Eliminar JavaScript e CSS de bloqueio de renderização no conteúdo acima da borda"

No caso eliminar o conteúdo da borda é você remover todos os includes css e js que ficam acima da tag body, pois Page Speed, considera que você primeiro deve carregar todo o html que é parte estrutural do seu site, para depois carregar os demais scripts.



Com os arquivos JS o melhor a se fazer é realmente inserir o conteúdo abaixo do footer, porem com o css não temos como fazer tal implementação :(



Temos um DevCast falando exatamente sobre essa questão: www.devmedia.com.br/como-otimizar-suas-paginas-web-com-pagespeed/38053
Depois dá uma olhada, forte abraço!



Concordo com o Fernando!


Obrigado Calebe!
Responder

26/07/2017

Lucas Santos

Fala pessoal, ótimas respostas , bem informativo.

Eu so fiquei com uma duvida, qual seria a melhor alternativa para o caso do CSS ? pois se colocar no final impacta o layout da pagina, que vai carregar "desfigurado" para so depois ser corrigido e se carregar no início tem esse impacto no pagespeed. Qual seria então a melhor solução ?

desde ja agradeço a todos.

um abraço
Responder

28/07/2017

Dayan Barros

Fala pessoal, ótimas respostas , bem informativo.

Eu so fiquei com uma duvida, qual seria a melhor alternativa para o caso do CSS ? pois se colocar no final impacta o layout da pagina, que vai carregar "desfigurado" para so depois ser corrigido e se carregar no início tem esse impacto no pagespeed. Qual seria então a melhor solução ?

desde ja agradeço a todos.

um abraço


Fala Lucas.

Bem, não sou expert nisso, mas você pode colocar um loading para não mostrar o conteúdo enquanto ele lê o CSS.

Abs
Responder

31/07/2017

Raphael Alves

Opa, tem uma técnica de CSS chamada Above the folding, onde você tem todo o css que aparece "antes da dobra", no caso seria o css que aparece antes de você dar o primeiro scroll, escrito dentro de um style no topo do próprio html, com isso ele é carregado sem fazer requisição e você pode fazer as requisições restantes no final do html.

Abs.
Responder

02/08/2017

Dayan Barros

Opa, tem uma técnica de CSS chamada Above the folding, onde você tem todo o css que aparece "antes da dobra", no caso seria o css que aparece antes de você dar o primeiro scroll, escrito dentro de um style no topo do próprio html, com isso ele é carregado sem fazer requisição e você pode fazer as requisições restantes no final do html.

Abs.


Essa técnica é muito boa mesmo, mas eu só faria ela na home do site, porque da muito trabalho.

Abs
Responder
×
+1 DevUP
Acesso diário, +1 DevUP
Parabéns, você está investindo na sua carreira