2

Is the Window.load event fired after all "non-postponed JavaScripts" have finished execution? "Non-postponed Javascripts" are defined as any JavaScripts loaded by the HTML page (inline or external or async or dynamically-generated or module), except for:

  1. Code inside onload() event handler
  2. Code inside any other handlers that await user inputs

The spec simply said that the load event fires "when the document has finished loading". It does not say whether or not the event fires before or after all non-postponed JavaScripts have finished execution.

The following posts are related, but do not answer this question directly.

Thanks!

Related Posts:

Arial
  • 326
  • 2
  • 11
  • No, the load event is fired when all HTML text is interpreted. Which means that the interpretation of the HTML text **only**, and not the different executions that this reading can generate, such as the loading of images, or scripts executions and different asynchronous processes that they can contain. – Mister Jojo Jun 02 '23 at 03:27
  • scripts execute immediately, unless deferred, which they have to so that `document.write` will work correctly (before the load event). You can be assured the script body has executed when onload fires, though it can queue up out of body executions like fetch(), setTimeout, etc. – dandavis Jun 02 '23 at 03:32
  • Hi @MisterJojo, do images load before or after onload() ? According to [the MDN documentation](https://developer.mozilla.org/en-US/docs/Web/API/Window/load_event), images load before onload(). – Arial Jun 02 '23 at 15:19
  • Hi @dandavis, thanks! So, what kind of executions are queued up, and what kind of executions are not queued up? Would you mind sharing a source for me to read up on? Thanks! – Arial Jun 02 '23 at 15:23
  • there is no relationship between the two. they are different processes and neither has priority over the other. – Mister Jojo Jun 02 '23 at 15:54
  • anything async is not guaranteed to have finished. Hard-coded image in the html should be loaded, but if you append a new one in a script using the dom, it doesn't have load. If you add the image using document.write() it will load before onload(). – dandavis Jun 02 '23 at 17:54

2 Answers2

2

WHATWG maintains the HTML Living Standard. Therefore, if they say that the "load" event is triggered "when the document has finished loading, " then that is the behaviour that browsers follow. The scripts do not necessarily finish before "onload".

https://html.spec.whatwg.org/multipage/indices.html#event-load

Emma
  • 316
  • 1
  • 7
0

window.onload waits for all external resources and synchronous Javascript to load, but it doesn't wait for:

  1. Asynchronous scripts <script async src="....
  2. Defered scripts <script defer src="....
  3. Modules <script type="module" src="....
  4. Event handler code eg.: onload(), onclick(). this not executed until the event happens.

Resources:

https://flaviocopes.com/javascript-async-defer/ https://html.spec.whatwg.org/multipage/scripting.html#the-script-element https://developer.mozilla.org/en-US/docs/Web/API/Window/load_event

Manuvo
  • 748
  • 5
  • 15
  • 1
    Thanks! Would you mind sharing a source URL for me to read up on? – Arial Jun 02 '23 at 15:24
  • @Arial [https://flaviocopes.com/javascript-async-defer/](https://flaviocopes.com/javascript-async-defer/) and [https://html.spec.whatwg.org/multipage/scripting.html#the-script-element](https://html.spec.whatwg.org/multipage/scripting.html#the-script-element) – Manuvo Jun 02 '23 at 15:28