Rich Media, Poor Computers May 27, 2010

Next time when you fight off that unwanted Flash overlay ad just to read a news article, keep in mind that you are not the only one who's annoyed. Your computer feels your pain too. Online publishers and advertisers put in tremendous effort to make their websites interactive and appealing, but every visual effect has its cost. While the computer is seemingly doing nothing after the web page is loaded, the CPU is busy tracking the mouse interaction and rendering every frame in all the animated banners. Is your computer fan louder than it use to be? Now you know why.

The two common underlying technologies that make interactive websites are JavaScript and Flash. They are also major sources of resource consumption, if not used properly.

The following screenshot plots the CPU usage incurred by the front page of Twitter.com. Notice the periodical spikes that indicate a high frequency timer that is used to simulate a "real time" feed update.



"Live feed" is becoming popular in many websites, but the HTTP protocol, on which web pages operate, uses a pulling mechanism, so JavaScript timer is the only way to make a site "live".

You might also have noticed the sluggish mouse hovering effects in many websites' menu section. If you happen to be a web developer, you'll see these websites use a JavaScript framework such as JQuery or MooTools. The efficiency of these frameworks is outside this article's scope. But they all support Query Selector - a lazy mechanism of addressing any objects on a webpage that share any forms of similarity. In non-technical words, this is some sort of magic. Magic is convenient but expensive.

Flash is another abused technology that consumes arguably the lion's share of your computing resource. Aside from Flash based websites, Flash animations are mostly used as interactive ad banners.

How to block Flash

Not all Flash objects are unwanted. Video streaming such as YouTube relies on Flash; or at least until HTML5 is well supported by mainstream browsers. FlashBlock, a plugin for Firefox, elegantly prevents Flash objects from being loaded automatically. You can click on the Play icon to enable a specific object. This is particularly useful when you need to watch a video but block the ads that also use Flash.



How to block GIF animation

Moderate use of animated GIF images would not drag your computer. If they becoming annoying, you can disable them in Firefox by typing "about:config" in the address bar, and set the value of the image.animation_mode field from normal to none.



How to block JavaScript... without crippling other websites

Similar to FlashBlock, there's also a Firefox plugin called ScriptBlock that blocks both JavaScript and Flash. It comes with a tin foil hat too! Well, not really, but if you are paranoid to disable JavaScript by default on all the "unknown" websites, you probably have a foil hat anyway. The point is, JavaScript is essential for many web applications to function; many of the Cross-Site Scripting (XSS) attacks do not even require JavaScript. If you really need to disable JavaScript for a specific website, click on the "allow scripts globally" in ScriptBlock settings. Note although this is not recommended by the author of the plugin, we believe that a blacklist approach is more suitable to regulate JavaScript. Flash, on the other hand could use a whitelist.

In conclusion, the excessive use of bells and whistles in today's online media and web applications have silently (not counting the fan noise) consumed our computing resource. There are measures to selectively disable these annoyances, but at a cost of convenience and trust. Irresponsive or inconsiderate use of Flash or JavaScript encourages the use of FlashBlock and ScriptBlock, which could in turn, unnecessarily block legitimate use in other web sites.