Intermediate JavaScript Interview QuestionsIntermediateComparison
JavaScript · Question 55
What is the difference between script async, script defer, and type="module" in the browser?
Direct answer
For classic external scripts, async executes as soon as the download is ready without preserving document order, defer waits until parsing finishes and preserves deferred-script order; module scripts are deferred by default unless async is specified.
Without special attributes, a classic external script encountered during HTML parsing can block further parsing while it is fetched/executed. async and defer let downloading overlap with HTML parsing but differ in execution timing and ordering.
- async — execute as soon as ready; useful for independent scripts where ordering relative to other scripts/DOM parsing is not required.
- defer — execute after parsing completes and before
DOMContentLoaded; deferred classic scripts preserve document order. - type="module" — module scripts are deferred by default, have module scope, use strict semantics, and can use import/export;
asyncchanges the default scheduling behavior for external modules.