Defer vs Async.. big difference

  • Resolved grantdb

    (@sixer)


    9 years, 1 month ago

    Once again great plugin! I find this plugin is a necessity on my website.

    I just wanted to let people know something that I found out regarding the order that scripts are loaded in WordPress.

    I couldn’t figure out why I kept getting jquery undeclared errors when everything seems perfect (except my mobile menu would work/notwork randomly). From what I have figured out, async does NOT honor the order that you have set the scripts on your site to load in. Where defer honors this order.

    I have not found much information on this, but for my site, I was getting undeclared and unknown references because jquery was not loading first.

    My personal opinion is to use this great plugin but to also be careful and either use defer and/or exclude certain scripts if you are concerned about the order that they are loaded!

    Thanks again for this great plugin!

    https://www.ads-software.com/plugins/async-javascript/

Viewing 2 replies - 1 through 2 (of 2 total)
  • Plugin Author David Clough

    (@cloughit)

    Hey @sixer,

    Thanks for your feedback. You are pretty much spot on with what you are saying. A good article I have found that explains the difference between async and defer can be found here: https://webkit.org/blog/1395/running-scripts-in-webkit/

    Here is an excerpt which sums it up pretty well:

    Both async and defer scripts begin to download immediately without pausing the parser and both support an optional onload handler to address the common need to perform initialization which depends on the script. The difference between async and defer centers around when the script is executed. Each async script executes at the first opportunity after it is finished downloading and before the window’s load event. This means it’s possible (and likely) that async scripts are not executed in the order in which they occur in the page. The defer scripts, on the other hand, are guaranteed to be executed in the order they occur in the page. That execution starts after parsing is completely finished, but before the document’s DOMContentLoaded event.

    Thread Starter grantdb

    (@sixer)

    Thanks for confirming this. Have a good one!

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Defer vs Async.. big difference’ is closed to new replies.