feat: added new optimization.entryIife option

alexander-akait · web-flow · commit 4866b0daf1df · 2024-09-25T16:58:02.000+03:00
diff --git a/declarations/WebpackOptions.d.ts b/declarations/WebpackOptions.d.ts
@@ -1696,6 +1696,10 @@ export interface NodeOptions {
  * Enables/Disables integrated optimizations.
  */
 export interface Optimization {
+	/**
+	 * Avoid wrapping the entry module in an IIFE.
+	 */
+	avoidEntryIife?: boolean;
 	/**
 	 * Check for incompatible wasm types when importing/exporting from/to ESM.
 	 */
diff --git a/lib/config/defaults.js b/lib/config/defaults.js
@@ -1434,6 +1434,7 @@ const applyOptimizationDefaults = (
 	D(optimization, "innerGraph", production);
 	D(optimization, "mangleExports", production);
 	D(optimization, "concatenateModules", production);
+	D(optimization, "avoidEntryIife", production);
 	D(optimization, "runtimeChunk", false);
 	D(optimization, "emitOnErrors", !production);
 	D(optimization, "checkWasmTypes", production);
diff --git a/lib/javascript/JavascriptModulesPlugin.js b/lib/javascript/JavascriptModulesPlugin.js
@@ -839,18 +839,25 @@ class JavascriptModulesPlugin {
 				startupSource.add(`var ${RuntimeGlobals.exports} = {};\n`);
 			}
 
-			const renamedInlinedModule = this.renameInlineModule(
-				allModules,
-				renderContext,
-				inlinedModules,
-				chunkRenderContext,
-				hooks
-			);
+			const avoidEntryIife = compilation.options.optimization.avoidEntryIife;
+			/** @type {Map<Module, Source> | false} */
+			let renamedInlinedModule = false;
+			if (avoidEntryIife) {
+				renamedInlinedModule = this.getRenamedInlineModule(
+					allModules,
+					renderContext,
+					inlinedModules,
+					chunkRenderContext,
+					hooks,
+					allStrict,
+					Boolean(chunkModules)
+				);
+			}
 
 			for (const m of inlinedModules) {
-				const renderedModule =
-					renamedInlinedModule.get(m) ||
-					this.renderModule(m, chunkRenderContext, hooks, false);
+				const renderedModule = renamedInlinedModule
+					? renamedInlinedModule.get(m)
+					: this.renderModule(m, chunkRenderContext, hooks, false);
 
 				if (renderedModule) {
 					const innerStrict =
@@ -868,9 +875,11 @@ class JavascriptModulesPlugin {
 							? // TODO check globals and top-level declarations of other entries and chunk modules
 								// to make a better decision
 								"it need to be isolated against other entry modules."
-							: exports && !webpackExports
-								? `it uses a non-standard name for the exports (${m.exportsArgument}).`
-								: hooks.embedInRuntimeBailout.call(m, renderContext);
+							: chunkModules && !renamedInlinedModule
+								? "it need to be isolated against other modules in the chunk."
+								: exports && !webpackExports
+									? `it uses a non-standard name for the exports (${m.exportsArgument}).`
+									: hooks.embedInRuntimeBailout.call(m, renderContext);
 					let footer;
 					if (iife !== undefined) {
 						startupSource.add(
@@ -1420,25 +1429,41 @@ class JavascriptModulesPlugin {
 	 * @param {Set<Module>} inlinedModules inlinedModules
 	 * @param {ChunkRenderContext} chunkRenderContext chunkRenderContext
 	 * @param {CompilationHooks} hooks hooks
-	 * @returns {Map<Module, Source>} renamed inlined modules
+	 * @param {boolean} allStrict allStrict
+	 * @param {boolean} hasChunkModules hasChunkModules
+	 * @returns {Map<Module, Source> | false} renamed inlined modules
 	 */
-	renameInlineModule(
+	getRenamedInlineModule(
 		allModules,
 		renderContext,
 		inlinedModules,
 		chunkRenderContext,
-		hooks
+		hooks,
+		allStrict,
+		hasChunkModules
 	) {
+		const innerStrict = !allStrict && allModules.every(m => m.buildInfo.strict);
+		const isMultipleEntries = inlinedModules.size > 1;
+		const singleEntryWithModules = inlinedModules.size === 1 && hasChunkModules;
+
+		// TODO:
+		// This step is before the IIFE reason calculation. Ideally, it should only be executed when this function can optimize the
+		// IIFE reason. Otherwise, it should directly return false. There are four reasons now, we have skipped two already, the left
+		// one is 'it uses a non-standard name for the exports'.
+		if (isMultipleEntries || innerStrict || !singleEntryWithModules) {
+			return false;
+		}
+
+		/** @type {Map<Module, Source>} */
+		const renamedInlinedModules = new Map();
 		const { runtimeTemplate } = renderContext;
 
 		/** @typedef {{ source: Source, ast: any, variables: Set<Variable>, usedInNonInlined: Set<Variable>}} InlinedModulesInfo */
-
 		/** @type {Map<Module, InlinedModulesInfo>} */
 		const inlinedModulesToInfo = new Map();
 		/** @type {Set<string>} */
 		const nonInlinedModuleThroughIdentifiers = new Set();
 		/** @type {Map<Module, Source>} */
-		const renamedInlinedModules = new Map();
 
 		for (const m of allModules) {
 			const isInlinedModule = inlinedModules && inlinedModules.has(m);
diff --git a/schemas/WebpackOptions.check.js b/schemas/WebpackOptions.check.js
diff --git a/schemas/WebpackOptions.json b/schemas/WebpackOptions.json
@@ -2580,6 +2580,10 @@
       "type": "object",
       "additionalProperties": false,
       "properties": {
+        "avoidEntryIife": {
+          "description": "Avoid wrapping the entry module in an IIFE.",
+          "type": "boolean"
+        },
         "checkWasmTypes": {
           "description": "Check for incompatible wasm types when importing/exporting from/to ESM.",
           "type": "boolean"
diff --git a/test/Defaults.unittest.js b/test/Defaults.unittest.js
@@ -265,6 +265,7 @@ describe("snapshots", () => {
 		    "global": true,
 		  },
 		  "optimization": Object {
+		    "avoidEntryIife": false,
 		    "checkWasmTypes": false,
 		    "chunkIds": "natural",
 		    "concatenateModules": false,
@@ -697,13 +698,15 @@ describe("snapshots", () => {
 		-   "mode": "none",
 		+   "mode": undefined,
 		@@ ... @@
+		-     "avoidEntryIife": false,
 		-     "checkWasmTypes": false,
 		-     "chunkIds": "natural",
 		-     "concatenateModules": false,
 		-     "emitOnErrors": true,
 		-     "flagIncludedChunks": false,
 		-     "innerGraph": false,
 		-     "mangleExports": false,
+		+     "avoidEntryIife": true,
 		+     "checkWasmTypes": true,
 		+     "chunkIds": "deterministic",
 		+     "concatenateModules": true,
@@ -764,13 +767,15 @@ describe("snapshots", () => {
 		-   "mode": "none",
 		+   "mode": "production",
 		@@ ... @@
+		-     "avoidEntryIife": false,
 		-     "checkWasmTypes": false,
 		-     "chunkIds": "natural",
 		-     "concatenateModules": false,
 		-     "emitOnErrors": true,
 		-     "flagIncludedChunks": false,
 		-     "innerGraph": false,
 		-     "mangleExports": false,
+		+     "avoidEntryIife": true,
 		+     "checkWasmTypes": true,
 		+     "chunkIds": "deterministic",
 		+     "concatenateModules": true,
diff --git a/test/Validation.test.js b/test/Validation.test.js
@@ -618,7 +618,7 @@ describe("Validation", () => {
 				expect(msg).toMatchInlineSnapshot(`
 			"Invalid configuration object. Webpack has been initialized using a configuration object that does not match the API schema.
 			 - configuration.optimization has an unknown property 'hashedModuleIds'. These properties are valid:
-			   object { checkWasmTypes?, chunkIds?, concatenateModules?, emitOnErrors?, flagIncludedChunks?, innerGraph?, mangleExports?, mangleWasmImports?, mergeDuplicateChunks?, minimize?, minimizer?, moduleIds?, noEmitOnErrors?, nodeEnv?, portableRecords?, providedExports?, realContentHash?, removeAvailableModules?, removeEmptyChunks?, runtimeChunk?, sideEffects?, splitChunks?, usedExports? }
+			   object { avoidEntryIife?, checkWasmTypes?, chunkIds?, concatenateModules?, emitOnErrors?, flagIncludedChunks?, innerGraph?, mangleExports?, mangleWasmImports?, mergeDuplicateChunks?, minimize?, minimizer?, moduleIds?, noEmitOnErrors?, nodeEnv?, portableRecords?, providedExports?, realContentHash?, removeAvailableModules?, removeEmptyChunks?, runtimeChunk?, sideEffects?, splitChunks?, usedExports? }
 			   -> Enables/Disables integrated optimizations.
 			   Did you mean optimization.moduleIds: \\"hashed\\" (BREAKING CHANGE since webpack 5)?"
 		`)
@@ -634,7 +634,7 @@ describe("Validation", () => {
 				expect(msg).toMatchInlineSnapshot(`
 			"Invalid configuration object. Webpack has been initialized using a configuration object that does not match the API schema.
 			 - configuration.optimization has an unknown property 'namedChunks'. These properties are valid:
-			   object { checkWasmTypes?, chunkIds?, concatenateModules?, emitOnErrors?, flagIncludedChunks?, innerGraph?, mangleExports?, mangleWasmImports?, mergeDuplicateChunks?, minimize?, minimizer?, moduleIds?, noEmitOnErrors?, nodeEnv?, portableRecords?, providedExports?, realContentHash?, removeAvailableModules?, removeEmptyChunks?, runtimeChunk?, sideEffects?, splitChunks?, usedExports? }
+			   object { avoidEntryIife?, checkWasmTypes?, chunkIds?, concatenateModules?, emitOnErrors?, flagIncludedChunks?, innerGraph?, mangleExports?, mangleWasmImports?, mergeDuplicateChunks?, minimize?, minimizer?, moduleIds?, noEmitOnErrors?, nodeEnv?, portableRecords?, providedExports?, realContentHash?, removeAvailableModules?, removeEmptyChunks?, runtimeChunk?, sideEffects?, splitChunks?, usedExports? }
 			   -> Enables/Disables integrated optimizations.
 			   Did you mean optimization.chunkIds: \\"named\\" (BREAKING CHANGE since webpack 5)?"
 		`)
@@ -650,7 +650,7 @@ describe("Validation", () => {
 				expect(msg).toMatchInlineSnapshot(`
 			"Invalid configuration object. Webpack has been initialized using a configuration object that does not match the API schema.
 			 - configuration.optimization has an unknown property 'occurrenceOrder'. These properties are valid:
-			   object { checkWasmTypes?, chunkIds?, concatenateModules?, emitOnErrors?, flagIncludedChunks?, innerGraph?, mangleExports?, mangleWasmImports?, mergeDuplicateChunks?, minimize?, minimizer?, moduleIds?, noEmitOnErrors?, nodeEnv?, portableRecords?, providedExports?, realContentHash?, removeAvailableModules?, removeEmptyChunks?, runtimeChunk?, sideEffects?, splitChunks?, usedExports? }
+			   object { avoidEntryIife?, checkWasmTypes?, chunkIds?, concatenateModules?, emitOnErrors?, flagIncludedChunks?, innerGraph?, mangleExports?, mangleWasmImports?, mergeDuplicateChunks?, minimize?, minimizer?, moduleIds?, noEmitOnErrors?, nodeEnv?, portableRecords?, providedExports?, realContentHash?, removeAvailableModules?, removeEmptyChunks?, runtimeChunk?, sideEffects?, splitChunks?, usedExports? }
 			   -> Enables/Disables integrated optimizations.
 			   Did you mean optimization.chunkIds: \\"size\\" and optimization.moduleIds: \\"size\\" (BREAKING CHANGE since webpack 5)?"
 		`)
diff --git a/test/__snapshots__/Cli.basictest.js.snap b/test/__snapshots__/Cli.basictest.js.snap
@@ -5230,6 +5230,19 @@ Object {
     "multiple": false,
     "simpleType": "string",
   },
+  "optimization-avoid-entry-iife": Object {
+    "configs": Array [
+      Object {
+        "description": "Avoid wrapping the entry module in an IIFE.",
+        "multiple": false,
+        "path": "optimization.avoidEntryIife",
+        "type": "boolean",
+      },
+    ],
+    "description": "Avoid wrapping the entry module in an IIFE.",
+    "multiple": false,
+    "simpleType": "boolean",
+  },
   "optimization-check-wasm-types": Object {
     "configs": Array [
       Object {
diff --git a/test/configCases/output-module/iife-entry-module-with-others/index.js b/test/configCases/output-module/iife-entry-module-with-others/index.js
@@ -0,0 +1,16 @@
+import { value as value1 } from './module1'
+const value2 = require('./module2')
+const value3 = require('./module3')
+
+let value = 42
+let src_value = 43
+let src_src_value = 44
+
+it('inlined module should not leak to non-inlined modules', () => {
+  expect(value1).toBe(undefined)
+  expect(value).toBe(42)
+  expect(src_value).toBe(43)
+  expect(src_src_value).toBe(44)
+  expect(value2).toBe("undefined") // should not touch leaked `value` variable
+  expect(value3).toBe("undefined") // should not touch leaked `src_value` variable
+})
diff --git a/test/configCases/output-module/iife-entry-module-with-others/module1.js b/test/configCases/output-module/iife-entry-module-with-others/module1.js
@@ -0,0 +1,3 @@
+let value
+
+export { value }
diff --git a/test/configCases/output-module/iife-entry-module-with-others/module2.js b/test/configCases/output-module/iife-entry-module-with-others/module2.js
@@ -0,0 +1 @@
+module.exports = typeof value
diff --git a/test/configCases/output-module/iife-entry-module-with-others/module3.js b/test/configCases/output-module/iife-entry-module-with-others/module3.js
@@ -0,0 +1 @@
+module.exports = typeof src_value
diff --git a/test/configCases/output-module/iife-entry-module-with-others/test.config.js b/test/configCases/output-module/iife-entry-module-with-others/test.config.js
@@ -0,0 +1,9 @@
+module.exports = {
+	findBundle: function (i, options) {
+		return [
+			"module-avoidEntryIife-false.mjs",
+			"module-avoidEntryIife-true.mjs",
+			"test.js"
+		];
+	}
+};
diff --git a/test/configCases/output-module/iife-entry-module-with-others/test.js b/test/configCases/output-module/iife-entry-module-with-others/test.js
@@ -0,0 +1,9 @@
+const fs = require("fs");
+const path = require("path");
+
+it("IIFE should present when `avoidEntryIife` is disabled, and avoided when true", () => {
+	const trueSource = fs.readFileSync(path.join(__dirname, "module-avoidEntryIife-true.mjs"), "utf-8");
+	const falseSource = fs.readFileSync(path.join(__dirname, "module-avoidEntryIife-false.mjs"), "utf-8");
+	expect(trueSource).not.toContain('This entry need to be wrapped in an IIFE');
+	expect(falseSource).toContain('This entry need to be wrapped in an IIFE because it need to be isolated against other modules in the chunk.');
+});
diff --git a/test/configCases/output-module/iife-entry-module-with-others/webpack.config.js b/test/configCases/output-module/iife-entry-module-with-others/webpack.config.js
@@ -0,0 +1,46 @@
+/** @type {import("../../../../types").Configuration} */
+const base = {
+	output: {
+		module: true
+	},
+	optimization: {
+		concatenateModules: true
+	},
+	experiments: {
+		outputModule: true
+	},
+	target: "es2020"
+};
+
+/** @type {import("../../../../types").Configuration[]} */
+module.exports = [
+	{
+		...base,
+		name: "module-avoidEntryIife-false",
+		output: {
+			filename: "module-avoidEntryIife-false.mjs"
+		},
+		optimization: {
+			...base.optimization,
+			avoidEntryIife: false
+		}
+	},
+	{
+		...base,
+		name: "module-avoidEntryIife-true",
+		output: {
+			filename: "module-avoidEntryIife-true.mjs"
+		},
+		optimization: {
+			...base.optimization,
+			avoidEntryIife: true
+		}
+	},
+	{
+		name: "test-output",
+		entry: "./test.js",
+		output: {
+			filename: "test.js"
+		}
+	}
+];
diff --git a/test/configCases/output-module/iife-innter-strict/foo.cjs b/test/configCases/output-module/iife-innter-strict/foo.cjs
@@ -0,0 +1 @@
+module.exports = 42;
diff --git a/test/configCases/output-module/iife-innter-strict/index.mjs b/test/configCases/output-module/iife-innter-strict/index.mjs
@@ -0,0 +1,14 @@
+import foo from  './foo.cjs';
+
+let answer
+
+try {
+    delete Object.prototype; // will throw error in strict mode
+		answer = 'no';
+	} catch {
+		answer = 'yes';
+}
+
+it("multiple inlined modules should be wrapped in IIFE to isolate from other inlined modules and chunk modules", () => {
+	expect(answer).toBe("yes"); // the code should throw in strict mode
+});
diff --git a/test/configCases/output-module/iife-innter-strict/test.config.js b/test/configCases/output-module/iife-innter-strict/test.config.js
@@ -0,0 +1,5 @@
+module.exports = {
+	findBundle: function (i, options) {
+		return ["test.js"];
+	}
+};
diff --git a/test/configCases/output-module/iife-innter-strict/test.js b/test/configCases/output-module/iife-innter-strict/test.js
@@ -0,0 +1,7 @@
+const fs = require("fs");
+const path = require("path");
+
+it("IIFE should present for inner strict", () => {
+	const source = fs.readFileSync(path.join(__dirname, "bundle0.js"), "utf-8");
+	expect(source).toContain(`This entry need to be wrapped in an IIFE because it need to be in strict mode.`);
+});
diff --git a/test/configCases/output-module/iife-innter-strict/webpack.config.js b/test/configCases/output-module/iife-innter-strict/webpack.config.js
@@ -0,0 +1,16 @@
+/** @type {import("../../../../").Configuration[]} */
+module.exports = [
+	{
+		entry: ["./index.mjs"],
+		output: {
+			module: false
+		}
+	},
+	{
+		name: "test-output",
+		entry: "./test.js",
+		output: {
+			filename: "test.js"
+		}
+	}
+];
diff --git a/test/configCases/output-module/iife-multiple-entry-modules/index1.js b/test/configCases/output-module/iife-multiple-entry-modules/index1.js
@@ -0,0 +1,4 @@
+
+ it("multiple inlined modules should be wrapped in IIFE to isolate from other inlined modules and chunk modules", () => {
+	expect(typeof value).toBe("undefined"); // `value` in index2 should not leak to index1
+});
diff --git a/test/configCases/output-module/iife-multiple-entry-modules/index2.js b/test/configCases/output-module/iife-multiple-entry-modules/index2.js
@@ -0,0 +1 @@
+var value = 42
diff --git a/test/configCases/output-module/iife-multiple-entry-modules/test.config.js b/test/configCases/output-module/iife-multiple-entry-modules/test.config.js
@@ -0,0 +1,5 @@
+module.exports = {
+	findBundle: function (i, options) {
+		return ["bundle0.mjs", "test.js"];
+	}
+};
diff --git a/test/configCases/output-module/iife-multiple-entry-modules/test.js b/test/configCases/output-module/iife-multiple-entry-modules/test.js
@@ -0,0 +1,7 @@
+const fs = require("fs");
+const path = require("path");
+
+it("IIFE should present for multiple entires", () => {
+	const source = fs.readFileSync(path.join(__dirname, "bundle0.mjs"), "utf-8");
+	expect(source).toContain(`This entry need to be wrapped in an IIFE because it need to be isolated against other entry modules.`);
+});
diff --git a/test/configCases/output-module/iife-multiple-entry-modules/webpack.config.js b/test/configCases/output-module/iife-multiple-entry-modules/webpack.config.js
@@ -0,0 +1,23 @@
+/** @type {import("../../../../").Configuration[]} */
+module.exports = [
+	{
+		entry: ["./index1.js", "./index2.js"],
+		output: {
+			module: true
+		},
+		optimization: {
+			concatenateModules: true
+		},
+		experiments: {
+			outputModule: true
+		},
+		target: "es2020"
+	},
+	{
+		name: "test-output",
+		entry: "./test.js",
+		output: {
+			filename: "test.js"
+		}
+	}
+];
diff --git a/test/configCases/output-module/inlined-module/index.js b/test/configCases/output-module/inlined-module/index.js
diff --git a/test/configCases/output-module/inlined-module/module1.js b/test/configCases/output-module/inlined-module/module1.js
diff --git a/test/configCases/output-module/inlined-module/module2.js b/test/configCases/output-module/inlined-module/module2.js
diff --git a/test/configCases/output-module/inlined-module/module3.js b/test/configCases/output-module/inlined-module/module3.js
diff --git a/test/configCases/output-module/inlined-module/webpack.config.js b/test/configCases/output-module/inlined-module/webpack.config.js
diff --git a/test/configCases/output-module/multiple-inlined-module/index-1.js b/test/configCases/output-module/multiple-inlined-module/index-1.js
diff --git a/test/configCases/output-module/multiple-inlined-module/index-2.js b/test/configCases/output-module/multiple-inlined-module/index-2.js
diff --git a/test/configCases/output-module/multiple-inlined-module/module1.js b/test/configCases/output-module/multiple-inlined-module/module1.js
diff --git a/test/configCases/output-module/multiple-inlined-module/module2.js b/test/configCases/output-module/multiple-inlined-module/module2.js
diff --git a/test/configCases/output-module/multiple-inlined-module/webpack.config.js b/test/configCases/output-module/multiple-inlined-module/webpack.config.js
diff --git a/types.d.ts b/types.d.ts

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,3 @@`
	`1`	`+let value`
	`2`	`+`
	`3`	`+export { value }`