Classic scripts v/s module scripts in Javascript

nikjohn picture nikjohn · Sep 23, 2016 · Viewed 8.2k times · Source

I was going through the WHATWG specs for async and defer attributes for the <script> tag, when I saw this statement:

Classic scripts may specify defer or async; module scripts may specify async.

I went through the WHATWG definitions for classic and module scripts, but didn't really get much clarity. Could someone explain to me like I'm 5, the differences between classic and module scripts in Javascript?

Answer

cquezel picture cquezel · Dec 17, 2018

Here are the differences I have noted from various articles. If you want more details, read a complete article on the web:

  1. Modules are singleton. They will be loaded and executed only once.
  2. Modules can use import and export.
  3. Modules are always executed in strict mode.
  4. All objects (class, const, function, let or var) are private unless explicitly exported.
  5. The value of "this" is undefined at the outer scope (not window).
  6. Modules are loaded asynchronously.
  7. Modules are loaded using CORS. see Access-Control-Allow-Origin: *.
  8. Modules don't send cookies and authentication info by default. See crossorigin="use-credentials".
  9. imports are resolved statically at load time rather than dynamically at runtime.
  10. html comments are not allowed.