What's the different between ASP.NET AJAX pageLoad() and JavaScript window.onload?

Question

I'm working with ASP.NET AJAX and want to understand the difference between these two snippets:

function pageLoad(sender, eventArgs) { }

and

window.onload = function() { }

• Do they act the same?
• Or is one called before the other?
• Or will one be called automatically and the another not?

Answer 1

A couple things to note first. MS invented a sort of "clientside runtime object" called Sys.Application. It handles raising init, load, and unload events throughout the [clientside] lifespan of the page, as follows:

1. Sys.Application.initialize() begins the init part of the life cycle. This initialize()s all clientside AJAX controls, after which they're ready to be interacted with programatically
2. Sys.Application begins the load part of the life cycle, calling all handlers that have subscribed to this event
3. Finally, it calls the global function pageLoad (if one is defined)

Step 2) and 3) are repeated for every partial (ie AJAX + UpdatePanel) postback.

So finally the answer: pageLoad is just a handy shortcut to Sys.Application.add_load().

With regards to its relationship to window.onload however, things start to get interesting. Essentially, MS needed window.onload to fire only after the init phase was complete. But you can't control when the browser will fire onload, as it's tied to "content loaded". This is known as "the window.onload problem":

onload event fires after all page content has loaded (including images and other binary content). If your page includes lots of images then you may see a noticeable lag before the page becomes active.

So, they just invented their own "special" function to fire at just the right time in their event life cycle and called it "pageLoad". And the trick that they used to kickoff this custom event life cycle was to place the call to Sys.Application.initialize() just before the closing </form> tag. The serverside runtime does this. Astute readers will note that this trick allowed MS to solve the window.onload problem, since any code you put into pageLoad will fire independent of binary content (w/ one rare catch for IE).

> Do they act the same?

Conceptually yes, in practice not at all due to said window.onload problem. The only rule is that you should put code that interacts with your AJAX controls in pageLoad only, since window.onload follows its own event trajectory.

> Or is one called before the other?

They are completely, 100% independent.

> Or will one be called automatically and the another not?

They will both be called if you have them defined.