-
-
Notifications
You must be signed in to change notification settings - Fork 3.3k
docs: add deferImport #7638
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
base: main
Are you sure you want to change the base?
docs: add deferImport #7638
Conversation
@Jack-Works is attempting to deploy a commit to the OpenJS Foundation Team on Vercel. A member of the Team first needs to authorize it. |
cc @nicolo-ribaudo maybe you are interested to review this 👀 |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
For me looks good
@@ -209,6 +210,55 @@ Enable additional in-memory caching of modules which are unchanged and reference | |||
|
|||
Defaults to the value of [`futureDefaults`](#experimentsfuturedefaults). | |||
|
|||
### experiments.deferImport | |||
|
|||
Enable support of the tc39 proposal [Deferring Module Evaluation](https://github.com/tc39/proposal-defer-import-eval). |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Nit, but even though the official proposal name is "deferring module evaluation" I think people know it more as "the import defer
proposal"
|
||
Enable support of the tc39 proposal [Deferring Module Evaluation](https://github.com/tc39/proposal-defer-import-eval). | ||
This allows deferring the evaluation of a module until its first use. | ||
This is useful when using dynamic `import()` is problematic. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This is useful when using dynamic `import()` is problematic. | |
This is useful to synchronously defer code execution when it's not possible to use `import()` due to its asynchronous nature. |
|
||
This feature requires the runtime environment to have [`Proxy`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy) (ES6) support. | ||
|
||
Enable the following syntaxes: |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Enable the following syntaxes: | |
Enables the following syntaxes: |
|
||
#### Limitations of magic comments (`/* webpackDefer: true */`) | ||
|
||
It's suggested to put the magic comment after the `from` keyword, other positions may work, but have not been tested. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
It's suggested to put the magic comment after the `from` keyword, other positions may work, but have not been tested. | |
It's suggested to put the magic comment after the `from` keyword. Other positions may work, but have not been tested. |
|
||
It's suggested to put the magic comment after the `from` keyword, other positions may work, but have not been tested. | ||
|
||
Putting the magic comment after the `import` keyword is known to be broken, it will break the filesystem cache. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Putting the magic comment after the `import` keyword is known to be broken, it will break the filesystem cache. | |
Putting the magic comment after the `import` keyword is incompatible with the filesystem cache. |
@@ -100,6 +100,124 @@ index.bundle.js 548 kB 1 [emitted] [big] index | |||
... | |||
``` | |||
|
|||
## Defer Import Example | |||
|
|||
W> This section does not lazy "load" a module, but lazy "evaluate" a module. This means that the module is still downloaded and parsed, but its evaluation is lazy. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
W> This section does not lazy "load" a module, but lazy "evaluate" a module. This means that the module is still downloaded and parsed, but its evaluation is lazy. | |
W> This feature does not lazily "load" a module, but it lazily "evaluates" a module. This means that the module is still downloaded and parsed, but its evaluation is lazy. |
|
||
In some cases, it might be annoying or hard to convert all uses of a module to asynchronous, since it enforces the unnecessary asyncification of all functions, without providing the ability to only defer the synchronous evaluation work. | ||
|
||
The tc39 proposal [Deferring Module Evaluation](https://github.com/tc39/proposal-defer-import-eval) is to solve this problem. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The tc39 proposal [Deferring Module Evaluation](https://github.com/tc39/proposal-defer-import-eval) is to solve this problem. | |
The TC39 proposal [Deferring Module Evaluation](https://github.com/tc39/proposal-defer-import-eval) is to solve this problem. |
Add docs for webpack/webpack#16567