← Back to release summary

Deferred imports evaluation ("import defer")

Category
JavaScript
Type
Chromium catches up
Status
Proposed (Chrome Proposed)
Intent stage
None

Summary

`import defer` allows lazily evaluating ES modules, to reduce the startup impact of modules that are not actually needed for the first JavaScript execution. This provides an easier-to-use alternative to dynamic import. While dynamic import provides more benefits, as it allows deferring loading of modules rather than just evaluation, it has a lot of friction due to its asynchronous nature, and thus it's not always usable. `import defer` follows the same syntax as regular imports, but it only works with namespace and dynamic imports: ``` import defer * as namespace from "./some-module.js" const namespace2 = await import.defer("./some-module.js"); ``` The module will be synchronously executed on property access on the module namespace object. To allow synchronous execution, not all of `./some-module.js`'s dependency tree will be deferred. Modules that contain top-level await will be eagerly executed, leaving only the synchronous parts of the tree for later.

Standards & signals

Explainers: https://github.com/tc39/proposal-defer-import-eval

View on chromestatus.com