Improving Twitter's loading time in your blog or site
Tuesday, January 20, 2009
If you are like me, you have twitter set up to display your updates on your blog.
Today is Obama's inauguration and obviously enough we are crazily twittering about the event. This leads to twitter's infrastructure to be overtaxed and network latency has increased considerably, to the point of twitter.com being down (more or less an expected DOS attack).
Why is this a problem?
The typical twitter set up looks as follows:
<ul id="twitter_update_list" style="list-style: none; margin-left: 0; padding-left: 0; margin-top: 0;"></ul>
<script src='http://twitter.com/javascripts/blogger.js' type='text/javascript'></script>
<script src='http://twitter.com/statuses/user_timeline/josesandoval.json?callback=twitterCallback2&count=1' type='text/javascript'></script>This is a problem because this code blocks the whole page from loading until the twitter code is downloaded. Today this takes a while and degrades your users' experience.
However, there are options. Try this:
<ul id="twitter_update_list" style="list-style: none; margin-left: 0; padding-left: 0; margin-top: 0;"></ul>
<script type='text/javascript'>
var head = document.getElementsByTagName("head")[0];
script = document.createElement('script');
script.type = 'text/javascript';
script.src = "http://twitter.com/javascripts/blogger.js";
head.appendChild(script);
</script>
<script type='text/javascript'>
var head = document.getElementsByTagName("head")[0];
script2 = document.createElement('script');
script2.type = 'text/javascript';
script2.src = "http://twitter.com/statuses/user_timeline/josesandoval.json?callback=twitterCallback2&count=1";
head.appendChild(script2);
</script>This code downloads the JavaScript concurrently with your other elements in the page--well, as many concurrent TCP/IP connections your browser allows. This means that the other elements in your site display without waiting for twitter to come back with content.
Your users' experience is not affected too much, but they will likely wait a few seconds to read your tweets.
Comments: