O Load das suas Frameworks via Google

Quantos desenvolvedores web não utilizam Frameworks Javascript para utilizarem efeitos e funções obtidas via Javascript no seu website? No entanto a maioria dos websites alojam eles mesmo a Framework, quer seja esta Mootools, Jquery, Dojo, Prototype, etc...

Na maioria destes sites alojar localmente este género de ficheiros é um erro. Um erro porque o Google fornece uma alternativa, que para pequenos médios sites é a ideal. A alternativa que o Google oferece é a de alojar versões destas frameworks, na sua própria CDN (Content Delivery Network), e permitir a qualquer pessoa utilizar estas Frameworks.

Se você alojar por exemplo uma versão do Mootools ou JQuery no seu website, o utilizador da primeira vez que chegar a este terá que realizar o download da sua versão. Isto é estar a gastar tráfego! No entanto se você estiver a carregar a versão fornecida pelo Google no seu website, as chances são que o utilizador já possua a versão em questão no cahe do browser. E se lá não estiver fará download a partir da CDN do Google.

Uma outra vantagem é o paralelismo de downloads que o browser pode fazer. O Firefox por exemplo só faz o download de dois ficheiros em simultâneo a partir de determinado domínio. Como normalmente as Frameworks de Javascript costumam ser um dos elementos mais pesados de uma página web, se você alojar localmente a Framework, o browser "fica preso" a realizar o download desta, enquanto outros elementos da página esperam para ser carregados. Ao realizar o download via Google tal não acontece.

Existem duas hipóteses em como realizar o load da Framework via Google.

A primeira é a mais poderosa e flexível. Utiliza google.load() para definir a Framework e a versão que deve ser carregada. E é a que o Google recomenda. O código a introduzir antes de </head> é o seguinte:

javascript
<script type="text/javascript" src="http://www.google.com/jsapi”></script>
<script type=”text/javascript”>
  google.load(”jquery”, “1.2.6″);
 
//google.setOnLoadCallback(function() {
    //Este código ao invés de $(document).ready()
// });
 
</script>

javascript
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>

Já sabe pode sempre subscrever o FeedRSS do weblouca.com

TrackBack URI for this entry