However, using a poor engineered service can degrade your website’s performance substantially. One real example I just faced is with the CHR Investor website. It is a brazilian blog I read and like very much, about stock market. They put a widget from Rec6, a brazilian Digg-like website. This widget is a Digg-like voting widget: it shows the number of votes the article has, and a button to vote on it.

However, the Rec6 servers have been very slow to respond and this is degrading the blog’s performance very much. As you can see in the next screenshot, taken from Firebug, the widget is loaded from an external javascript, which takes ~9 seconds to load (actually, in my tests the response time is varying between 5 and 12 seconds)!

Those who already read the excellent High Performance Web Sites book (chapter 6, more precisely) know what this means: an external javascript blocks everything until it is entirely loaded. This can be seem clearly in the picture: only after the widget is loaded, the rest of the page is downloaded.

The result from the visitor point of view is also very noticeable: the beginning of the page is loaded and rendered, everything freezes for ~9 seconds (the amount of time it takes to load the javascript from Rec6), and only then the rest of the page is rendered, very quickly.

So, if you intend to embed some kind of external service in your website, it is important to measure if they can handle the load of thousands (millions?) of users using their service.

I use some services here, like Google Adsense, Google Analytics, and the Google Reader Shared Items. The Google Analytics and Google Reader are a little slow (~200-400ms), but they don’t hurt because I can move them to the end of the page. The more problematic is Adsense because it writes content in the middle of the page, so you cannot move it. But the response times (~300ms each ad) don’t hurt, and are just fine.

More reading:

http://developer.yahoo.com/performance/rules.html#js_bottom