Module execution order is wrong with shared bundles

[mischnic]

🐛 bug report

Shared bundles currently hoist imports, so they aren't executed interleaved with the importing bundle.

Fixing this would also fix rollup/rollup#3888 for us. Also add a test for that!

🤔 Expected Behavior

Prints:

shared1
run1 1
shared2
run1 2

😯 Current Behavior

The current Rollup behaviour is also wrong

Prints:

shared1
shared2
run1 1
run1 2

💁 Possible Solution

Wrap assets in shared bundles

Some ressources:

• Opportunity: Improve compiler performance by avoiding property accesses microsoft/TypeScript#39247
• https://nolanlawson.com/2016/08/15/the-cost-of-small-modules/
• https://twitter.com/devongovett/status/1349926320562712577

💻 Code Sample

// index.js
import("./a.js");
if (Date.now() < 0) {
	import("./b.js"); // force a shared bundle for shared{1,2}.js
}

// a.js
import "./run1.js";
import "./run2.js";

// b.js
import "./shared1.js";
import "./shared2.js";

// run1.js
import x from "./shared1.js";
console.log("run1", x);

// run2.js
import x from "./shared2.js";
console.log("run2", x);

// shared1.js
console.log("shared1");
export default 1;

// shared2.js
console.log("shared2");
export default 2;

🌍 Your Environment

Software	Version(s)
Parcel	49ac217

[mischnic]

Another instance of this:

console.log("b");
require("./c.js");

behaves like

import "./c.js";
console.log("b");

if c.js is in a shared bundle

[mischnic]

Another symptom of this: some assets can be executed multiple times

💻 Code Sample

// index.js
import("./async1.js");
function a() {
	import("./async2.js");
}
function b() {
	import("./async3.js");
}

// async1.js
import "./u.js";
import "./v.js";

// async2.js
import "./u.js";

// async3.js
import "./v.js";

// u.js
import "./w.js";
console.log("u")
/*
padding to reach size of 2198 bytes
*/

// v.js
import "./w.js";
console.log("v")
/*
padding to reach size of 2198 bytes
*/

// w.js
console.log("w");

and "minBundleSize": 1000

dist/index.js                                                                                        13.35 KB    211ms
├── ...
└── index.js                                                                                            105 B    198ms

dist/async1.26929bae.js                                                                               1.05 KB    208ms
└── async1.js                                                                                            33 B     23ms

dist/async1.1508bd3a.js                                                                                 957 B    207ms
├── u.js                                                                                              2.15 KB     14ms
└── w.js                                                                                                 17 B      7ms

dist/async1.ea6776cc.js                                                                                 957 B    206ms
├── v.js                                                                                              2.15 KB     14ms
└── w.js                                                                                                 17 B      7ms

dist/async2.edefc9a5.js                                                                                 956 B    209ms
└── async2.js                                                                                            17 B     23ms

dist/async3.5dcb026d.js                                                                                 956 B    210ms
└── async3.js

Output is:

w
v
w
u

💻 Code Sample

// index.js
import("./async1.js");
import("./async2.js");

// async1.js
import "./v.js";

// async2.js
import "./v.js";

// v.js
console.log("v")

and "minBundleSize": 10000

dist/index.js                                                                                        13.35 KB    211ms
├── ...
└── index.js                                                                                            46 B    156ms

dist/async1.b39c03fd.js                                                                                859 B    132ms
├── u.js                                                                                             2.13 KB      6ms
└── async1.js                                                                                           17 B     11ms

dist/async2.6b9bcef9.js                                                                                859 B    131ms
├── u.js                                                                                             2.13 KB      6ms
└── async2.js                                                                                           17 B     12ms

Output is

u
u

[mischnic]

Actually also related: #5064