Widgets Can Kill Your Website
Today, it is very common for people to embed widgets in their website, blog, etc. Usually these widgets are provided by social apps who want to promote their service by inserting their widgets in most sites, in exchange to providing some kind to benefit to the site owner, like improving visibility by using some kind of ranking, etc.
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
But who really cares about true render speeds if one is using a very fast fiber optic cable? Sure I agree, during the initial page post time it does require extra seconds to load the code and fill the page but many today are so lazy they would rather wait on visual rather than textual data. You are correct in your analysis but I feel this is subjective unfortinately to so many. Our society has become too lazy with viral technology and many just do not like to read at all but thank you for the awesome article.
Rick L. Sprinkle