Twitter ButtonJe constate que le bouton twitter, celui là à droite, au dessus des commentaires, est particulièrement long à charger par moment, et bloque l'affichage de la page. C'est très génant, car selon les designs, une partie importante du site peut être masqué pendant un temps important. Ici, par exemple, ce sont les commentaires, la sidebar et le footer qui doivent attendre jusqu'à 10 secondes avant d'arriver. C'est pour ça qu'il est nécessaire de modifier l'insertion de ce script pour qu'il soit chargé de façon asynchrone une fois la page entièrement chargée.

Ça tombe bien, les gens de chez Twitter sont de bons développeurs qui codent correctement et ils n'ont pas utilisé la fonction javascrip document.write qui aurait mis en échec toute notre stratégie. Pour rappel, le code à insérer pour afficher le bouton ressemble à ceci :

[html]
<a href="http://twitter.com/share" class="twitter-share-button" data-count="vertical" data-via="hadrienl" data-lang="fr">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>

Le problème se situe donc quand http://platform.twitter.com/widgets.js met trop de temps à répondre. La navigateur attends toujours une réponse avant de continue à lire la suite du code source de la page. On va donc remplacer ce script par un autre script qui l'appellera uniquement quand la page sera chargée :

[html]
<a href="http://twitter.com/share" class="twitter-share-button" data-count="vertical" data-via="hadrienl" data-lang="fr">Tweet</a>
<script type="text/javascript" charset="utf-8">
//<![CDATA[
	YAHOO.util.Event.onDOMReady(
		function(e)
		{
			var s = document.createElement('script');
			s.src = 'http://platform.twitter.com/widgets.js';
			document.body.appendChild(s);
		}
	);
//]]>
</script>

J'utilise ici la librairie YUI mais on aurait pu faire la même chose avec n'importe quelle autre librairie, et même sans.

Le script est inséré dynamiquement dans la page quand celle-ci est chargé, et peut donc prendre tout son temps pour arriver. Une fois là, il construira le bouton twitter tranquillement.