Closed loynoir closed 10 months ago
That case would still load all the browser-dep
, deno-dep
, and node-dep
modules with all their dependencies, even if only one will be executed.
If you can access the IS_*
conditions in the top-level scope, I would recommend doing this instead:
import foobarDep from 'foobar-dep'
import browserDep from 'browser-dep' with { lazyInit: true }
import denoDep from 'deno-dep' with { lazyInit: true }
import nodeDep from 'node-dep' with { lazyInit: true }
const { default: dep } = await import(
IS_BROWSER ? 'browser-dep' : IS_DENO ? 'deno-dep' : IS_NODE ? 'node-dep' : error()
);
function foobar() {
return [foobarDep(), dep()]
}
An alternative is to just do this:
import foobarDep from 'foobar-dep'
import dep from 'dep'
function foobar() {
return [foobarDep(), dep()]
}
And use three different import maps in the three environments to map dep
to the correct module.
Avoiding unnecessary execution is a well-known optimization in the Node.js CommonJS module system, where there is a smaller gap between load contention and execution contention
@nicolo-ribaudo
Ah, above code is just a simple reproduce for optional dependency.
import dep from 'https://slow.network/optional-dep' with { lazyInit: true }
Current ESM lack of an SIMPLE AND AST-FRIENDLY way to write optional dependency.
I think, SIMPLE AND AST-FRIENDLY optional dependency should also be part of unnecessary web execution optimization consideration.
@loynoir You can currently use top-level await to implement optional dependencies:
try {
var dep = await import("https://slow.network/optional-dep");
} catch {}
if (dep) {
// dep has been loaded
} else {
// loading dep failed
}
We are also planning a dynamic import form of this proposal, similar to https://github.com/tc39/proposal-source-phase-imports:
try {
var dep = await import.defer("https://slow.network/optional-dep");
} catch {}
I agree in general that we should consider improvements to ECMAScript's module system, but we are trying to keep proposals focused on a single problem/solution.
Is this the solution for below case?
Is so, I think, should also add to example use case, as I think it's better to read at first glance.