Merge pull request webpack#8459 from webpack/feature/source-type-size

Add support for multiple different sizes per module

Author: sokra

declarations/WebpackOptions.d.ts

@@ -233,6 +233,18 @@ export type WebpackPluginFunction = (
  * via the `definition` "RuleSetRules".
  */
 export type RuleSetRules = RuleSetRule[];
+/**
+ * This interface was referenced by `WebpackOptions`'s JSON-Schema
+ * via the `definition` "OptimizationSplitChunksSizes".
+ */
+export type OptimizationSplitChunksSizes =
+	| number
+	| {
+			/**
+			 * Size of the part of the chunk with the type of the key
+			 */
+			[k: string]: number;
+	  };
 /**
  * This interface was referenced by `WebpackOptions`'s JSON-Schema
  * via the `definition` "FilterTypes".
@@ -926,15 +938,15 @@ export interface OptimizationSplitChunksOptions {
 					/**
 					 * Maximal size hint for the created chunks
 					 */
-					maxSize?: number;
+					maxSize?: OptimizationSplitChunksSizes;
 					/**
 					 * Minimum number of times a module has to be duplicated until it's considered for splitting
 					 */
 					minChunks?: number;
 					/**
 					 * Minimal size for the created chunk
 					 */
-					minSize?: number;
+					minSize?: OptimizationSplitChunksSizes;
 					/**
 					 * Give chunks for this cache group a name (chunks with equal name are merged)
 					 */
@@ -972,11 +984,11 @@ export interface OptimizationSplitChunksOptions {
 		/**
 		 * Maximal size hint for the created chunks
 		 */
-		maxSize?: number;
+		maxSize?: OptimizationSplitChunksSizes;
 		/**
 		 * Minimal size for the created chunk
 		 */
-		minSize?: number;
+		minSize?: OptimizationSplitChunksSizes;
 	};
 	/**
 	 * Sets the template for the filename for created chunks (Only works for initial chunks)
@@ -997,15 +1009,15 @@ export interface OptimizationSplitChunksOptions {
 	/**
 	 * Maximal size hint for the created chunks
 	 */
-	maxSize?: number;
+	maxSize?: OptimizationSplitChunksSizes;
 	/**
 	 * Minimum number of times a module has to be duplicated until it's considered for splitting
 	 */
 	minChunks?: number;
 	/**
 	 * Minimal size for the created chunks
 	 */
-	minSize?: number;
+	minSize?: OptimizationSplitChunksSizes;
 	/**
 	 * Give chunks created a name (chunks with equal name are merged)
 	 */

lib/ChunkGraph.js

@@ -81,17 +81,33 @@ const createOrderedArrayFunction = comparator => {
 };
 
 /**
- * @param {SortableSet<Module>} set the sortable Set to get the count/size of
+ * @param {Iterable<Module>} modules the modules to get the count/size of
  * @returns {number} the size of the modules
  */
-const getModulesSize = set => {
+const getModulesSize = modules => {
 	let size = 0;
-	for (const module of set) {
-		size += module.size();
+	for (const module of modules) {
+		for (const type of module.getSourceTypes()) {
+			size += module.size(type);
+		}
 	}
 	return size;
 };
 
+/**
+ * @param {Iterable<Module>} modules the sortable Set to get the size of
+ * @returns {Record<string, number>} the sizes of the modules
+ */
+const getModulesSizes = modules => {
+	let sizes = Object.create(null);
+	for (const module of modules) {
+		for (const type of module.getSourceTypes()) {
+			sizes[type] = (sizes[type] || 0) + module.size(type);
+		}
+	}
+	return sizes;
+};
+
 class ChunkGraphModule {
 	constructor() {
 		/** @type {SortableSet<Chunk>} */
@@ -509,6 +525,15 @@ class ChunkGraph {
 		return cgc.modules.getFromUnorderedCache(getModulesSize);
 	}
 
+	/**
+	 * @param {Chunk} chunk the chunk
+	 * @returns {Record<string, number>} total sizes of all modules in the chunk by source type
+	 */
+	getChunkModulesSizes(chunk) {
+		const cgc = this._getChunkGraphChunk(chunk);
+		return cgc.modules.getFromUnorderedCache(getModulesSizes);
+	}
+
 	/**
 	 * @param {Chunk} chunk the chunk
 	 * @param {ChunkSizeOptions} options options object
@@ -540,10 +565,7 @@ class ChunkGraph {
 		const cgcB = this._getChunkGraphChunk(chunkB);
 		const allModules = new Set(cgcA.modules);
 		for (const m of cgcB.modules) allModules.add(m);
-		let modulesSize = 0;
-		for (const module of allModules) {
-			modulesSize += module.size();
-		}
+		let modulesSize = getModulesSize(allModules);
 		const chunkOverhead =
 			typeof options.chunkOverhead === "number" ? options.chunkOverhead : 10000;
 		const entryChunkMultiplicator =

lib/ContextModule.js

@@ -875,9 +875,10 @@ webpackEmptyAsyncContext.id = ${JSON.stringify(id)};`;
 	}
 
 	/**
+	 * @param {string=} type the source type for which the size should be estimated
 	 * @returns {number} the estimated size of the module
 	 */
-	size() {
+	size(type) {
 		// base penalty
 		const initialSize = 160;
 

lib/DelegatedModule.js

@@ -148,9 +148,10 @@ class DelegatedModule extends Module {
 	}
 
 	/**
+	 * @param {string=} type the source type for which the size should be estimated
 	 * @returns {number} the estimated size of the module
 	 */
-	size() {
+	size(type) {
 		return 42;
 	}
 

lib/DllModule.js

@@ -85,9 +85,10 @@ class DllModule extends Module {
 	}
 
 	/**
+	 * @param {string=} type the source type for which the size should be estimated
 	 * @returns {number} the estimated size of the module
 	 */
-	size() {
+	size(type) {
 		return 12;
 	}
 

lib/ExternalModule.js

@@ -244,9 +244,10 @@ class ExternalModule extends Module {
 	}
 
 	/**
+	 * @param {string=} type the source type for which the size should be estimated
 	 * @returns {number} the estimated size of the module
 	 */
-	size() {
+	size(type) {
 		return 42;
 	}
 

lib/Generator.js

@@ -31,6 +31,24 @@ class Generator {
 		return new ByTypeGenerator(map);
 	}
 
+	/**
+	 * @abstract
+	 * @returns {Set<string>} available types (do not mutate)
+	 */
+	getTypes() {
+		throw new Error("Generator.getTypes: must be overridden");
+	}
+
+	/**
+	 * @abstract
+	 * @param {NormalModule} module the module
+	 * @param {string=} type source type
+	 * @returns {number} estimate size of the module
+	 */
+	getSize(module, type) {
+		throw new Error("Generator.getSize: must be overridden");
+	}
+
 	/**
 	 * @abstract
 	 * @param {NormalModule} module module for which the code should be generated
@@ -49,6 +67,25 @@ class ByTypeGenerator extends Generator {
 	constructor(map) {
 		super();
 		this.map = map;
+		this._types = new Set(Object.keys(map));
+	}
+
+	/**
+	 * @returns {Set<string>} available types (do not mutate)
+	 */
+	getTypes() {
+		return this._types;
+	}
+
+	/**
+	 * @param {NormalModule} module the module
+	 * @param {string=} type source type
+	 * @returns {number} estimate size of the module
+	 */
+	getSize(module, type) {
+		const t = type || "javascript";
+		const generator = this.map[t];
+		return generator ? generator.getSize(module, t) : 0;
 	}
 
 	/**

lib/JavascriptGenerator.js

@@ -48,7 +48,29 @@ const sortFragmentWithIndex = ([a, i], [b, j]) => {
 	return i - j;
 };
 
+const TYPES = new Set(["javascript"]);
+
 class JavascriptGenerator extends Generator {
+	/**
+	 * @returns {Set<string>} available types (do not mutate)
+	 */
+	getTypes() {
+		return TYPES;
+	}
+
+	/**
+	 * @param {NormalModule} module the module
+	 * @param {string=} type source type
+	 * @returns {number} estimate size of the module
+	 */
+	getSize(module, type) {
+		const originalSource = module.originalSource();
+		if (!originalSource) {
+			return 39;
+		}
+		return originalSource.size();
+	}
+
 	/**
 	 * @param {NormalModule} module module for which the code should be generated
 	 * @param {GenerateContext} generateContext context for generate

lib/JavascriptModulesPlugin.js

@@ -5,9 +5,7 @@
 
 "use strict";
 
-const { SyncBailHook } = require("tapable");
 const { ConcatSource } = require("webpack-sources");
-const Compilation = require("./Compilation");
 const HotUpdateChunk = require("./HotUpdateChunk");
 const JavascriptGenerator = require("./JavascriptGenerator");
 const JavascriptParser = require("./JavascriptParser");
@@ -18,41 +16,14 @@ const createHash = require("./util/createHash");
 /** @typedef {import("webpack-sources").Source} Source */
 /** @typedef {import("./Chunk")} Chunk */
 /** @typedef {import("./ChunkTemplate")} ChunkTemplate */
+/** @typedef {import("./Compilation")} Compilation */
 /** @typedef {import("./Compiler")} Compiler */
 /** @typedef {import("./Module")} Module */
 /** @typedef {import("./ModuleTemplate")} ModuleTemplate */
 /** @typedef {import("./ModuleTemplate").RenderContext} RenderContext */
 /** @typedef {import("./RuntimeTemplate")} RuntimeTemplate */
 
-/**
- * @typedef {Object} JavascriptModulesPluginHooks
- * @property {SyncBailHook<Module, Chunk>} shouldRender
- */
-
-/** @type {WeakMap<Compilation, JavascriptModulesPluginHooks>} */
-const compilationHooksMap = new WeakMap();
-
 class JavascriptModulesPlugin {
-	/**
-	 * @param {Compilation} compilation the compilation
-	 * @returns {JavascriptModulesPluginHooks} hooks
-	 */
-	static getHooks(compilation) {
-		if (!(compilation instanceof Compilation)) {
-			throw new TypeError(
-				"The 'compilation' argument must be an instance of Compilation"
-			);
-		}
-		let hooks = compilationHooksMap.get(compilation);
-		if (hooks === undefined) {
-			hooks = {
-				shouldRender: new SyncBailHook(["module", "chunk"])
-			};
-			compilationHooksMap.set(compilation, hooks);
-		}
-		return hooks;
-	}
-
 	/**
 	 * @param {Compiler} compiler webpack compiler
 	 * @returns {void}
@@ -62,12 +33,6 @@ class JavascriptModulesPlugin {
 			"JavascriptModulesPlugin",
 			(compilation, { normalModuleFactory }) => {
 				const moduleGraph = compilation.moduleGraph;
-				const hooks = JavascriptModulesPlugin.getHooks(compilation);
-				hooks.shouldRender.tap("JavascriptModulesPlugin", module => {
-					if (module.type === "javascript/auto") return true;
-					if (module.type === "javascript/dynamic") return true;
-					if (module.type === "javascript/esm") return true;
-				});
 				normalModuleFactory.hooks.createParser
 					.for("javascript/auto")
 					.tap("JavascriptModulesPlugin", options => {
@@ -134,10 +99,9 @@ class JavascriptModulesPlugin {
 				compilation.mainTemplate.hooks.modules.tap(
 					"JavascriptModulesPlugin",
 					(source, moduleTemplate, renderContext) => {
-						const chunk = renderContext.chunk;
 						return Template.renderChunkModules(
 							renderContext,
-							m => hooks.shouldRender.call(m, chunk),
+							m => m.getSourceTypes().has("javascript"),
 							moduleTemplate,
 							"/******/ "
 						);
@@ -220,7 +184,7 @@ class JavascriptModulesPlugin {
 						chunk,
 						compareModulesById(chunkGraph)
 					)) {
-						if (hooks.shouldRender.call(m, chunk)) {
+						if (m.getSourceTypes().has("javascript")) {
 							hash.update(chunkGraph.getModuleHash(m));
 						}
 					}
@@ -243,12 +207,10 @@ class JavascriptModulesPlugin {
 	 * @returns {Source} the rendered source
 	 */
 	renderJavascript(compilation, chunkTemplate, moduleTemplate, renderContext) {
-		const hooks = JavascriptModulesPlugin.getHooks(compilation);
-
 		const chunk = renderContext.chunk;
 		const moduleSources = Template.renderChunkModules(
 			renderContext,
-			m => hooks.shouldRender.call(m, chunk),
+			m => m.getSourceTypes().has("javascript"),
 			moduleTemplate
 		);
 		const core = chunkTemplate.hooks.modules.call(

lib/JsonGenerator.js

@@ -25,7 +25,27 @@ const stringifySafe = data => {
 	); // invalid in JavaScript but valid JSON
 };
 
+const TYPES = new Set(["javascript"]);
+
 class JsonGenerator extends Generator {
+	/**
+	 * @returns {Set<string>} available types (do not mutate)
+	 */
+	getTypes() {
+		return TYPES;
+	}
+
+	/**
+	 * @param {NormalModule} module the module
+	 * @param {string=} type source type
+	 * @returns {number} estimate size of the module
+	 */
+	getSize(module, type) {
+		let data = module.buildInfo.jsonData;
+		if (!data) return 0;
+		return stringifySafe(data).length + 10;
+	}
+
 	/**
 	 * @param {NormalModule} module module for which the code should be generated
 	 * @param {GenerateContext} generateContext context for generate