Cornerstone Blog

Switching the LightningDOM’s inner architecture from a two-dimensional array (or array-of-arrays) to a one-dimensional array has been tempting for some time. For one, this will simplify and speed up .innerHTML() and .outerHTML().

It has also been quite tempting to maintain a separate, persistent array of end-tag-indexes.

But if you have a dual, paired data structure (an array of HTML strings paired with an array of end-tag-indexes), why not have more data in the second array? Why not store the tagName, the id and the className? Why not ditch the flyweight pattern and maintain a real node? And why not store parentNode, firstChild, nextSibling and make the whole data structure a linked list instead of a flat array?

This would kill two ugly birds with the same stone. It would allow the LightningDOM to be a drop-in replacement for the DOM (except the innerHTML property, which would still need to be “functionalized”). Granted, I would need to create the idea of “textNodes” to completely simulate the DOM.

There are a host of benefits that come with this. For instance, John Resig’s Sizzle would work against the LightningDOM as well as the real DOM. More importantly, client code could trivially switch back to the real DOM if the user has a yet-to-be-released browser with screaming DOM speedups while simultaneously providing snappy speeds on current-generation browsers.