[PATCH] Faster onload for Event.onload

diff file

Nice, but shouldn't it also check if the element is a window and not just if it's a load event? We want to use the old/regular way when doing things like:

var img = document.createElement("img");
Event.observe(img, 'load', function() {alert("image loaded")});
img.src = "...";

How do one check for window objects? Looking for some properties like innerWidth, location, status, open, resizeTo etc?

Ha good point!

I've updated my demo here: http://www.agileweb.org/examples/prototypeOnLoad.html Which uses object extension to prototype rather than a patched prototype.

I changed the check to:

if (name == 'load' && element.screen)

element.screen should be available to all modern browsers: http://www.quirksmode.org/viewport/compatibility.html

I'll attach an updated diff.

updated Patch

Added new patch - bug found in IE where not all dom content loaded before started processing.

Now fixed :)

Added final patch - another IE test case showed if a very slow image was loaded it broke.

Have simplified the process away from using a setInterval in IE back to attaching an event to the script.readystatechange - to call the loader.

If you need test pages let me know - http://www.agileweb.org/examples/prototypeOnLoad.html

Shows it in use working, if your browser doesnt support one of the quicker load methods i.e. Opera 8 - then no harm is done as the default caller is still applied.

I kind of like this, but this changes the behaviour of pages that rely on the window load event to only fire after page assets have loaded. How about adding a new event called domload? (maybe you can think of an even better name)

Also, this can be unit tested (by firing a normal onload event too, filling up an array). Feel free to reopen the ticket with the patch editing accordingly and unit tests attached.

Adding 'domReady' Event - seems to be the convetional name.

A diff will be attached and a test page - it broke the unit test script - so there are no unit tests (it returned a null error line 266 of unittest.js and I havent had time to debug that..)

domReady Patch to event.js

domReady - test / example

Perhaps the name should be case insensitive so that one could pass 'domready' or 'DOMReady' or 'domReady'.

Also I think the patch should use something like this snippet instead of conditional comments to avoid issues when the script is run through a compressor/compactor.

if (document.addEventListener)
  document.addEventListener("DOMContentLoaded", onDomReady, false);
else if (document.attachEvent && !window.opera) {
  document.write('<script id=__ie_onload defer src=://><\/script>');
  var script = document.getElementById('__ie_onload');
  script.onreadystatechange = function() {
    if (this.readyState == 'complete') onDomReady();
  };
}

Ok - taken on board and added case insensitivity for domReady.

Also shrunk the IE conditions, theres no need for the conditionals as if there isnt a domready equivalent then it falls through back to observing onload.

New diff file attached :)

Event js updated

I agree with Thomas about how replacing "load" isn't necessarily the best course of action. On the other hand, I think having a different function altogether (Event.domReady) is inconsistent.

How about we call it "DOMContentLoaded"? It is the standard, after all (DOM Level 3 Events), so we might as well start calling it that. That way, once all browsers support DOMContentLoaded natively (i.e., 89068903 years from now), we'd be able to remove all the special code without breaking backwards-compatibility.

Replying to savetheclocktower:

How about we call it "DOMContentLoaded"?

That is absolutely brilliant

Hello subscribers. You'll like [6596] that happened in the event branch just now :)

It'll be in trunk soon.

Support for this was added to trunk in [7270].