Tuesday, November 18th, 2008
We posted on reglib, the new declarative event based library by Greg Reimer. I was a little confused at first, but Greg has posted a follow up which includes a demonstration comparing reglib to jQuery that makes his strategy a lot clearer:
Let me first of all stress that I’m not trying to bust on JQuery here. JQuery does something that needs to be done, and it does it just about as well as can be done given the tool-set browsers have collectively placed at our disposal.
With that said, I’m going to go ahead and pimp the reglib way of doing things, by which I mean declarative, over the load-traverse-modify methodology, which JQuery makes so easy.
The demo page linked below has two identical interactive widgets; one wired up using JQuery, and the other wired up using reglib.
The page is rigged like a science experiment, with a control followed by several tests in which you observe differences in behavior between the two widgets in response to various stimuli. The goal is to demonstrate reglib’s resilience under duress (as it were). Enjoy.
The tests show:
The JQuery widget has been cloned using the DOM clone() method. After closing this message, note how the cloned version is non-functional. This is because event behavior needs to be explicitly re-added to each new element under the load-traverse-modify methodology.
The reglib widget has been cloned using the DOM clone() method. After closing this message, note how the cloned version functions normally since reglib event declarations automatically affect all additions to the DOM.
The DOM has been completely overwritten by:
document.body.innerHTML += '';After closing this message, note how none of the JQuery widgets work anymore, meanwhile the reglib widgets continue to function as normal.
At the end of this page’s HTML source is a comment containing a huge block of random numbers. If you don’t have a fast internet connection and you SHIFT+RELOAD this page, it will simulate network latency and/or or dynamic page processing delays, which cause a delay before the load event fires. After closing this message, SHIFT+RELOAD the page. While the page is yellow it means the load event hasn’t fired. During this time, note how the JQuery widget is non-functional, but the reglib widget is functional. This may not be apparent if you have a fast internet connection.
Posted by Dion Almaer at 6:44 am