Night Dreaming (by Sudar)

I just finished viewing John Resig’s talk titled “DOM is a mess” at Yahoo. I took some notes while watching the video and I am posting them here, so that I can refer to them at a later point of time (It is easier to search when it is not on paper 🙂 ). Also it might help someone to get the outline of the talk before actually watching the video. The original video runs for more than an hour.

Also be warned that the following is my own interpretation of the video and I might have missed or could have interpreted some point differently. 🙂

About the speaker, John Resig

As you all know John Resig is the creator of the excellent jQuery library. He works for Mozilla corporation and you can get more information about him from his blog.

DOM is a mess

This is the first thing John Resig said about DOM methods after saying that DOM is a messy

Nearly every DOM method is broken in some way, in some browser.

The following are some of the bugs in the DOM methods

getElementByID ()

IE and Old versions of Opera return elements whose name == id

getElementByTagName ()

.length gets overwritten in IE if an element with an ID = “length” is found

getElementsByClassName ()

Opera doesn’t match a second specified class

querySelectorAll ()

Safari 3.2 can’t match uppercase characters in quirks mode.

So the moral is that almost every method in DOM is messed up.

Writing Cross-browser code

Find out the cost/benefit ratio for supporting a browser and then pick the browsers you are going to support before writing your code.

He talked about Yahoo’s graded support and jQuery browser Support.

Escaping from DOM’s mess

The following are some of the tips to escape from DOM’s mess.

• Having a good test suite is not a facility but a requirement.
• Don’t introduce global variables or extend native objects.
• The order in which style sheets are included matters.
• Don’t use browser sniffing, but use Object detection or feature simulation instead.
• Don’t assume a browser will always have a bug. They might get fixed in a future release.
• Gracefully degrade for old browsers
• As your code matures, the number of assumptions should reduce.
• While removing elements from DOM, clean it by unbinding the events

Links

• Post about the video at YUI Blog
• Watch the video at Yahoo videos or download it in m4v format.
• Slides used in the video are available at slideshare.
• John Resig’s post about this talk.

So my dear readers what you think about my notes. Also let me know if you like notes for videos in this format. If there is a demand, then I can post some of my notes on other videos which I have already viewed.