https://hoist-learn.netlify.app/chunk-CJOa_MOF.js

1var e=[{id:`tla-sibling-order`,lessonId:`tla`,prompt:"`dep.mjs` logs, awaits a 50 ms timer, then logs again. `sync.mjs` just logs. `main.mjs` imports dep then sync and logs. What is the output order?",lang:`js`,code:`// main.mjs
2import { value } from './dep.mjs';
3import { s } from './sync.mjs';
4console.log('main body', value, s);`,answer:"`dep: start`, `sync module body`, `dep: done`, `main body 42 1`",why:`An awaiting module does not block its siblings — the runtime keeps evaluating the rest of the graph. Only the importer waits, and it waits for *all* of its dependencies.`},{id:`tla-blocks-importer`,lessonId:`tla`,prompt:`Does a top-level await in one module delay code in a module that does not import it?`,answer:`No. It delays only the modules that depend on it (transitively). Independent branches of the graph evaluate normally.`,why:`Top-level await makes a module *asynchronous*, and asynchrony propagates strictly along import edges — which is why it can never deadlock a whole program, only the subtree below it.`},{id:`tla-require-async`,lessonId:`tla`,prompt:"A CommonJS file calls `require()` on an ES module that uses top-level await, on Node 22. What happens?",lang:`js`,code:`// c.cjs
5const x = require('./dep.mjs'); // dep.mjs has a top-level await`,answer:'It throws `ERR_REQUIRE_ASYNC_MODULE`: "require() cannot be used on an ESM graph with top-level await. Use import() instead."',why:"`require()` is synchronous by definition and cannot suspend, so Node can evaluate an ES module from CJS only when nothing in that graph awaits. One TLA anywhere below poisons the whole subgraph for require."},{id:`tla-rejection`,lessonId:`tla`,prompt:`A module rejects at top level. Can the importer catch it?`,lang:`js`,code:`// boom.mjs
6await Promise.reject(new Error('nope'));
7
8// importer.mjs
9try {
10  await import('./boom.mjs');
11} catch (e) { console.log('caught:', e.message); }`,answer:"Yes — `caught: nope`. The dynamic import's promise rejects with the module's error.",why:"A rejected top-level await becomes the module evaluation error. A *static* import cannot catch it, so `import()` inside try/catch is the only way to make a failing module recoverable."},{id:`tla-vs-iife`,lessonId:`tla`,prompt:"What did top-level await actually fix that an async IIFE — `(async () => { … })()` — did not?",answer:`Exports. With an IIFE the module finishes evaluating immediately and its exports are still empty when importers read them, so consumers had to import a promise. With TLA the importer is genuinely suspended until the exports are populated.`,why:`This is the whole point: TLA moves the waiting into the module graph, so a dependency can be asynchronous without leaking that fact into every consumer's type and call site.`},{id:`tla-cost`,lessonId:`tla`,prompt:`What is the main cost of putting a top-level await in a widely imported module?`,answer:"Every module downstream of it becomes asynchronous too, so the whole subtree is delayed; it can no longer be `require()`d from CommonJS; and bundlers must emit extra wrapper machinery, which some targets do not support at all.",why:`Asynchrony is contagious along import edges. A TLA in a leaf utility is cheap; the same await in a shared config module serialises application startup behind it.`},{id:`tla-where-allowed`,lessonId:`tla`,prompt:`Where is top-level await legal?`,answer:'Only in ES modules — `.mjs`, a file under `"type": "module"`, or a `<script type="module">`. Never in CommonJS, and never in a classic script.',why:`A classic script and a CJS module have no mechanism to suspend and resume evaluation; only the ES module record has the async evaluation state that top-level await needs.`}];export{e as t};