domingo, 17 de julho de 2011

Onde Colocar Javascript Externo: Head ou Body?

seo
Saiba se é melhor colocar chamadas para javascript externo dentro da head ou body de uma página para tornar o seu website mais rápido.

Cada vez mais o javascript é uma parte integrante de websites e surgem várias aplicações cruciais que precisam de carregar ficheiros .js para funcionar como o Google Analytis, o Plus One, AdSense e muitas mais. Para cada um destes ficheiros o seu browser tem que fazer uma ligação externa para os abrir e muitas vezes os próprios ficheiros javascript são enormes.

Sendo assim é muito importante otimizar o carregamento de todos os seus ficheiros externos para melhorar a velocidade do carregamento das páginas que hoje em dia é um fator importante para o SEO.

Depois de fazer alguma pesquisa cheguei à conclusão que é melhor por todos os seus carregamentos de ficheiros javascript externos na head da página porque assim eles serão carregados antes da página abrir e quando chegar à parte de carregar o aplicativo que os vai usar eles já estão carregados e prontos a ser usados.

Se os colocar dentro do body eles serão carregados quando o browser chegar a essa parte da página o que vai fazer com que a página não carregue tão suavemente.

Se pegarmos em exemplos práticos eles reforçam esta ideia:
  • Google Analytics: O código deixou de ser colocado no fundo do documento e passou a ser colocado dentro da head
  • Google Plus One: A chamada para o ficheiro javascript que faz o botão funcionar é colocado na head
Isto são apenas dois exemplos que hoje em dia é melhor colocar todo o seu javascript na head do documento e até existem algumas maneiras de fazer com que os ficheiros sejam todos carregados ao mesmo tempo poupando assim tempo precioso, mas isso é matéria para outro post.

2 comentários:

  1. Yahoo! usa no final do body por padrão, até onde sei.

    ResponderExcluir
  2. Pode ser colocado onde quiser e cada um terá as suas técnicas mas o local onde coloca vai ditar a ordem de carregamento.

    Do que tenho reparado até há pouco tempo eram maioritariamente colocados dentro ou depois da tag body, talvez para não atrasar o carregamento da página, mas a verdade é que se começa a ver esta alteração de passar para a dentro da head ficheiros que sejam ligados a aplicativos como botões de partilha.

    ResponderExcluir