Recently I asked one of the Javascript devs on the Windows Live Spaces team to review the code for some of my gadgets to see if he could point out areas for improvement. One thing he mentioned was that there were a ton of memory leaks in my gadgets. This took me by surprise since the thought of a memory leak in some AJAX code running in a browser sounded like a throwback to the days of writing apps in C/C++. So I went back and took a look at the Windows Live gadget SDK, and sure as hell there was a section of the documentation entitled Avoiding Memory Leaks which states
Memory leaks are the number one contributor to poor performance for AJAX-style websites. Often
code that appears to be written correctly will turn out to be the source of a massive memory
leak, and these leaks can be very difficult to track down. Luckily, there are a few simple
guidelines which can help you avoid most memory leaks. The Live.com developers follow these
rules religiously, and recommend that you do the same when implementing Gadgets.
- Make sure you null any references to DOM elements (and other bindings for good measure) in dispose().
- Call
the base dispose method at the end of your dispose method. (conversely,
call the base initialize at the beginning of your initialize method)
- Detach all events that you attach.
- For any temp DOM element vars created while constructing the DOM, null the temp var before exiting the method.
- Any function parameters that are DOM elements coming in should be nulled before returning from the method.
There are a number of websites and blog entries that document approaches for identifying
and fixing memory leaks in AJAX applications. One such helpful site can be found
here.
A great way to see whether your Gadget is leaking memory is to use the following
URL to load your Gadget: http://gadgets.start.com/gadget.aspx?manifestUrl=gadgetManifestUrl.
Open Task Manager in Windows and monitor the memory usage of the Internet Explorer
window. Keep reloading the Gadget in Internet Explorer to see if the memory usage
increases over time. If the memory usage increases, it is indicative that your Gadget
is leaking memory.
This is the entirety of the documentation on avoiding memory leaks in Windows Live gadgets. Granted there is some useful information in the blog post referenced from the SDK. The post implies that memory leaks in AJAX code are an Internet Explorer problem as opposed to a general browser issue.
Most of the guidelines in the above excerpt were pretty straightforward except for the one about detaching all events you attach. I wasn't sure how event handling differed between Firefox and IE (the only browsers I test gadgets on) so I started down the path of doing some research. and this led me to a number of informative posts on Quirksmode. They include
- Traditional event registration model
- Advanced event registration models
- addEvent() considered harmful
The information in the above pages is worth its weight in gold if you're a Javascript developer. I can't believe I spent all this time without ever reading Quirksmode. The Windows Live gadgets team would be doing gadgets developers a lot of favors by including the above links to their documentation.
There is also an interesting observation about the end user perceptions about who's to blame for badly written gadgets. The comment about memory leaks in my gadgets answered the question of why Internet Explorer uses as much as 200MB of memory when running my Live.com start page. At first, I assumed the problem was with Live.com and then after switching browsers to Firefox I saw some improvement and then assumed the problem was with IE. It never crossed my mind that the problem was the poor coding in the gadgets on my page. This may just be because I was the author of many of the gadgets on my page but I suspect that when the average end user hits problems with poorly written gadgets causing issues with Live.com or Windows Live Spaces pages, Microsoft is the entity that gets the blame not the gadget developers.
Just like with Windows®, poorly written applications often reflect badly on the platform and not just the application. Interesting food for thought if you are interested in building Web platforms.