work

1-js/2-first-steps/02-external-script/2-async-defer-first/solution.md

@@ -0,0 +1,5 @@
+Answers:
+
+1. The first is `big.js`, that's a normal sequence for external `<script>` tags.
+2. The first is `small.js`, because `async` makes script behave independently of each other and the page. The first to loads runs first.
+3. The first is `big.js`, because "deferred" scripts keep relative execution order.

1-js/2-first-steps/02-external-script/2-async-defer-first/task.md

@@ -0,0 +1,29 @@
+importance: 4
+
+---
+
+# Which script executes first?
+
+In the questions below, there are two scripts: `small.js` and `big.js`.
+
+If we assume that `small.js` loads much faster compared to `big.js` -- which script executes first?
+
+```html
+<script src="big.js"></script>
+<script src="small.js"></script>
+```
+
+What if we add `async`?
+
+```html
+<script async src="big.js"></script>
+<script async src="small.js"></script>
+```
+
+What if we switch to `defer`?
+
+```html
+<script defer src="big.js"></script>
+<script defer src="small.js"></script>
+```
+