feat: Initialize renderer in generated services script (#292)

Author: jespertheend

editor/src/tasks/TaskManager.js

@@ -48,22 +48,32 @@ import {Task} from "./task/Task.js";
  */
 
 /**
- * This contains all expected configs based on the task type. This is used for
+ * This contains all expected tasks based on the task type. This is used for
  * better autocompletions for `runTask` or `runChildTask`. However, since it's possible
  * for plugins to add their own task types, if an unknown task type is used, the expected
  * type of the config parameter of the function is 'unknown'.
  * @typedef {{
- * 	"renda:buildApplication": import("./task/TaskBuildApplication.js").TaskBuildApplicationConfig,
- * 	"renda:bundleAssets": import("./task/TaskBundleAssets.js").TaskBundleAssetsConfig,
- * 	"renda:bundleScripts": import("./task/TaskBundleScripts.js").TaskBundleScriptsConfig,
- * 	"renda:generateHtml": import("./task/TaskGenerateHtml.js").TaskGenerateHtmlConfig,
- * 	"renda:generateServices": import("./task/TaskGenerateServices.js").TaskGenerateServicesConfig,
- * }} KnownTaskConfigs
+ * 	"renda:buildApplication": import("./task/TaskBuildApplication.js").TaskBuildApplication,
+ * 	"renda:bundleAssets": import("./task/TaskBundleAssets.js").TaskBundleAssets,
+ * 	"renda:bundleScripts": import("./task/TaskBundleScripts.js").TaskBundleScripts,
+ * 	"renda:generateHtml": import("./task/TaskGenerateHtml.js").TaskGenerateHtml,
+ * 	"renda:generateServices": import("./task/TaskGenerateServices.js").TaskGenerateServices,
+ * }} KnownTasks
  */
 
 /**
  * @template {string} T
- * @typedef {T extends keyof KnownTaskConfigs ? KnownTaskConfigs[T] : unknown} GetExpectedTaskConfig
+ * @typedef {T extends keyof KnownTasks ? KnownTasks[T] : unknown} GetExpectedTask
+ */
+
+/**
+ * @template {string} T
+ * @typedef {GetExpectedTask<T> extends import("./task/Task.js").Task<infer TConfig> ? TConfig : unknown} GetExpectedTaskConfig
+ */
+
+/**
+ * @template {string} T
+ * @typedef {GetExpectedTask<T> extends import("./task/Task.js").Task<any, infer TCustomData> ? import("./task/Task.js").RunTaskReturn<TCustomData> : never} GetExpectedTaskReturn
  */
 
 export class TaskManager {
@@ -164,14 +174,15 @@ export class TaskManager {
 	 * @param {RunTaskOptions} [options]
 	 */
 	async runTask(taskType, taskConfig, options) {
-		return await this.#runTaskInternal(taskType, taskConfig, options);
+		const result = await this.#runTaskInternal(taskType, taskConfig, options);
+		return /** @type {GetExpectedTaskReturn<T>} */ (result);
 	}
 
 	/**
 	 * @param {string} taskType
 	 * @param {unknown} taskConfig
 	 * @param {RunTaskOptions} options
-	 * @returns {Promise<import("./task/Task.js").RunTaskReturn>}
+	 * @returns {Promise<import("./task/Task.js").RunTaskReturn<any>>}
 	 */
 	async #runTaskInternal(taskType, taskConfig, options = {}) {
 		const task = this.initializeTask(taskType);
@@ -224,14 +235,15 @@ export class TaskManager {
 				});
 			},
 			runChildTask: async (taskType, taskConfig, options = {}) => {
-				return await this.#runTaskInternal(taskType, taskConfig, {
+				const result = await this.#runTaskInternal(taskType, taskConfig, {
 					...options,
 					allowDiskWrites: options.allowDiskWrites ?? allowDiskWrites,
 					environmentVariables: {
 						...environmentVariables,
 						...options.environmentVariables,
 					},
 				});
+				return /** @type {GetExpectedTaskReturn<typeof taskType>} */ (result);
 			},
 		});
 

editor/src/tasks/task/Task.js

@@ -3,6 +3,7 @@
  */
 
 /**
+ * @template [TCustomData = unknown]
  * @typedef RunTaskReturn
  * @property {RunTaskCreateAssetData[]} [writeAssets] A list of assets that this task should create when done running.
  * This is useful if you want to modify files in a very basic way. The assets will be created and written to the output location.
@@ -15,6 +16,7 @@
  * flag is set to true.
  * @property {import("../../../../src/mod.js").UuidString[]} [touchedAssets] A list of assets that this task touched, or
  * might touch when the task is run a second time. This is used by other tasks for determining if this task needs to run before them.
+ * @property {TCustomData} [customData] Custom data that a task might return, this is only useful when a task is run from a script.
  */
 
 /**
@@ -52,6 +54,7 @@
 
 /**
  * @template [TTaskConfig = unknown]
+ * @template [TCustomData = unknown]
  */
 export class Task {
 	/**
@@ -125,7 +128,7 @@ export class Task {
 
 	/**
 	 * @param {RunTaskOptions<TTaskConfig>} options
-	 * @returns {Promise<RunTaskReturn>}
+	 * @returns {Promise<RunTaskReturn<TCustomData>>}
 	 */
 	async runTask(options) {
 		throw new Error(`Task "${this.constructor.name}" does not implement runTask().`);

editor/src/tasks/task/TaskBuildApplication.js

@@ -62,6 +62,7 @@ export class TaskBuildApplication extends Task {
 	}
 
 	/**
+	 * Asserts if a task resulted in writing exactly one asset.
 	 * @param {import("./Task.js").RunTaskReturn} taskResult
 	 */
 	#assertSingleWriteAsset(taskResult) {
@@ -72,6 +73,7 @@ export class TaskBuildApplication extends Task {
 	}
 
 	/**
+	 * Asserts if a task resulted in writing exactly one asset that is a string.
 	 * @param {import("./Task.js").RunTaskReturn} taskResult
 	 */
 	#assertSingleStringWriteAsset(taskResult) {
@@ -129,21 +131,27 @@ export class TaskBuildApplication extends Task {
 				return result;
 			},
 			/**
-			 * @param {number} contextId
-			 * @param {import("../../../../src/mod.js").UuidString[]} uuids
+			 * @param {Object} options
+			 * @param {number} options.contextId
+			 * @param {import("../../../../src/mod.js").UuidString[]} options.usedAssetsUuids
+			 * @param {import("../../../../src/mod.js").UuidString[]} options.entryPointUuids
 			 */
-			generateServices: async (contextId, uuids) => {
+			generateServices: async ({contextId, usedAssetsUuids, entryPointUuids}) => {
 				const context = this.getContext(contextId);
 				const generateServicesResult = await context.runChildTask("renda:generateServices", {
 					outputLocation: ["services.js"],
-					usedAssets: uuids,
+					usedAssets: usedAssetsUuids,
+					entryPoints: entryPointUuids,
 				}, {
 					allowDiskWrites: false,
 				});
 				const servicesScript = this.#assertSingleStringWriteAsset(generateServicesResult);
 
 				return {
-					returnValue: servicesScript,
+					returnValue: {
+						servicesScript,
+						usedAssets: generateServicesResult.customData?.usedAssets || [],
+					},
 				};
 			},
 			/**

editor/src/tasks/task/TaskGenerateServices.js

@@ -1,3 +1,5 @@
+import {CLUSTER_BOUNDS_SHADER_ASSET_UUID, CLUSTER_LIGHTS_SHADER_ASSET_UUID} from "../../../../src/mod.js";
+import {ProjectAssetTypeJavascript} from "../../assets/projectAssetType/ProjectAssetTypeJavascript.js";
 import {createTreeViewStructure} from "../../ui/propertiesTreeView/createStructureHelpers.js";
 import {Task} from "./Task.js";
 
@@ -17,6 +19,10 @@ import {Task} from "./Task.js";
  * asset uuids that are expected to be loaded. The task uses this list to determine
  * which asset loader types should be included. This way, loader types that are
  * not needed are not included when bundling with tree shaking enabled.
+ * @property {import("../../../../src/mod.js").UuidString[]} entryPoints A list of
+ * JavaScript asset uuids that will be using the generated services file. It is used to
+ * analyse which services are actually used so that any unused services can be omitted
+ * from the generation.
  */
 
 /**
@@ -56,12 +62,27 @@ import {Task} from "./Task.js";
  * to the current ProjectAssetType config.
  */
 
-/** @extends {Task<TaskGenerateServicesConfig>} */
+/**
+ * @typedef TaskGenerateServicesCustomData
+ * @property {import("../../../../src/mod.js").UuidString[]} usedAssets
+ */
+
+/** @extends {Task<TaskGenerateServicesConfig, TaskGenerateServicesCustomData>} */
 export class TaskGenerateServices extends Task {
 	static uiName = "Generate Services";
 	static type = "renda:generateServices";
 
 	static configStructure = createTreeViewStructure({
+		entryPoints: {
+			type: "array",
+			tooltip: "A list of script files that is checked for usage of the generated services. Some parts of the generated services script are omitted depending on usage, in order to reduce bundle size.",
+			guiOpts: {
+				arrayType: "droppable",
+				arrayGuiOpts: {
+					supportedAssetTypes: [ProjectAssetTypeJavascript],
+				},
+			},
+		},
 		outputLocation: {
 			type: "array",
 			guiOpts: {
@@ -70,13 +91,15 @@ export class TaskGenerateServices extends Task {
 		},
 		usedAssets: {
 			type: "array",
+			tooltip: "A list of assets that are expected to be loaded. Unused asset types are stripped from the asset loader in order to reduce bundle size.",
 			guiOpts: {
 				arrayType: "droppable",
 			},
 		},
 	});
 
 	/**
+	 * @override
 	 * @param {import("./Task.js").RunTaskOptions<TaskGenerateServicesConfig>} options
 	 */
 	async runTask({config}) {
@@ -89,20 +112,27 @@ export class TaskGenerateServices extends Task {
 			throw new Error("Failed to run task: no asset manager.");
 		}
 
-		/** @type {Map<import("../../assets/projectAssetType/ProjectAssetType.js").ProjectAssetTypeIdentifier, Set<import("../../assets/ProjectAsset.js").ProjectAssetAny>>} */
-		const assetTypes = new Map();
-		for await (const uuid of assetManager.collectAllAssetReferences(config.usedAssets)) {
-			const asset = await assetManager.getProjectAssetFromUuid(uuid);
-			if (asset?.assetType) {
-				let assetsSet = assetTypes.get(asset.assetType);
-				if (!assetsSet) {
-					assetsSet = new Set();
-					assetTypes.set(asset.assetType, assetsSet);
-				}
-				assetsSet.add(asset);
+		let entryPointContents = "";
+		for (const entryPoint of config.entryPoints) {
+			const asset = await assetManager.getProjectAssetFromUuid(entryPoint, {
+				assertAssetType: ProjectAssetTypeJavascript,
+			});
+			if (asset) {
+				const content = await asset.readAssetData();
+				entryPointContents += content;
 			}
 		}
 
+		// TODO: This is a pretty primitive way of figuring out which services are needed, since we are
+		// essentially just looking if some strings of text appear in one of the entry points.
+		// Ideally we would parse the ast and figure out what is being used that way.
+		// It would add a lot of complexity and wouldn't be able to handle all cases, but right now
+		// if large files are used as entry points, the chance of these strings existing a pretty big so
+		// there could be a lot of false positives.
+		let needsAssetLoader = entryPointContents.includes("assetLoader");
+		let needsEngineAssetsManager = entryPointContents.includes("engineAssetsManager");
+		const needsRenderer = entryPointContents.includes("renderer");
+
 		/** @type {Map<string, Set<string>>} */
 		const collectedImports = new Map();
 		/**
@@ -118,6 +148,14 @@ export class TaskGenerateServices extends Task {
 			identifiers.add(identifier);
 		}
 
+		/**
+		 * A list of asset uuids that the engine requires to function.
+		 * Assets in this list will automatically get bundled when the services
+		 * script is generated as part of the 'build application' task.
+		 * @type {Set<import("../../../../src/mod.js").UuidString>}
+		 */
+		const usedAssets = new Set();
+
 		/**
 		 * @typedef CollectedAssetLoaderType
 		 * @property {string} instanceIdentifier
@@ -131,30 +169,52 @@ export class TaskGenerateServices extends Task {
 		/** @type {Set<string>} */
 		const collectedExportIdentifiers = new Set();
 
-		for (const [assetTypeIdentifier, assets] of assetTypes) {
-			const assetType = this.editorInstance.projectAssetTypeManager.getAssetType(assetTypeIdentifier);
-			const config = assetType?.assetLoaderTypeImportConfig;
-			if (config) {
-				const moduleSpecifier = config.moduleSpecifier || "renda";
-				addImport(config.identifier, moduleSpecifier);
-				let extra = "";
-				if (config.extra) {
-					extra = await config.extra({
-						editor: this.editorInstance,
-						addImport,
-						usedAssets: Array.from(assets),
+		if (needsAssetLoader) {
+			/** @type {Map<import("../../assets/projectAssetType/ProjectAssetType.js").ProjectAssetTypeIdentifier, Set<import("../../assets/ProjectAsset.js").ProjectAssetAny>>} */
+			const assetTypes = new Map();
+			for await (const uuid of assetManager.collectAllAssetReferences(config.usedAssets)) {
+				const asset = await assetManager.getProjectAssetFromUuid(uuid);
+				if (asset?.assetType) {
+					let assetsSet = assetTypes.get(asset.assetType);
+					if (!assetsSet) {
+						assetsSet = new Set();
+						assetTypes.set(asset.assetType, assetsSet);
+					}
+					assetsSet.add(asset);
+				}
+			}
+
+			for (const [assetTypeIdentifier, assets] of assetTypes) {
+				const assetType = this.editorInstance.projectAssetTypeManager.getAssetType(assetTypeIdentifier);
+				const config = assetType?.assetLoaderTypeImportConfig;
+				if (config) {
+					const moduleSpecifier = config.moduleSpecifier || "renda";
+					addImport(config.identifier, moduleSpecifier);
+					let extra = "";
+					if (config.extra) {
+						extra = await config.extra({
+							editor: this.editorInstance,
+							addImport,
+							usedAssets: Array.from(assets),
+						});
+					}
+					collectedAssetLoaderTypes.set(config.identifier, {
+						instanceIdentifier: config.instanceIdentifier || "",
+						extra,
+						returnInstanceIdentifier: config.returnInstanceIdentifier ?? true,
 					});
 				}
-				collectedAssetLoaderTypes.set(config.identifier, {
-					instanceIdentifier: config.instanceIdentifier || "",
-					extra,
-					returnInstanceIdentifier: config.returnInstanceIdentifier ?? true,
-				});
 			}
 		}
 
-		const needsAssetLoader = collectedAssetLoaderTypes.size > 0;
-
+		if (needsRenderer) {
+			addImport("WebGpuRenderer", "renda");
+			needsEngineAssetsManager = true;
+		}
+		if (needsEngineAssetsManager) {
+			addImport("EngineAssetsManager", "renda");
+			needsAssetLoader = true;
+		}
 		if (needsAssetLoader) {
 			addImport("AssetLoader", "renda");
 		}
@@ -169,6 +229,7 @@ export class TaskGenerateServices extends Task {
 
 		// Services instantiation
 		code += "export function initializeServices() {\n";
+
 		if (needsAssetLoader) {
 			code += "	const assetLoader = new AssetLoader();\n";
 			code += "\n";
@@ -193,12 +254,25 @@ export class TaskGenerateServices extends Task {
 			}
 		}
 
+		if (needsEngineAssetsManager) {
+			code += "const engineAssetsManager = new EngineAssetsManager(assetLoader);";
+			collectedExportIdentifiers.add("engineAssetsManager");
+		}
+
+		if (needsRenderer) {
+			code += "const renderer = new WebGpuRenderer(engineAssetsManager);";
+			code += "renderer.init();";
+			collectedExportIdentifiers.add("renderer");
+			usedAssets.add(CLUSTER_BOUNDS_SHADER_ASSET_UUID);
+			usedAssets.add(CLUSTER_LIGHTS_SHADER_ASSET_UUID);
+		}
+
 		// Return object
 		code += `	return {${Array.from(collectedExportIdentifiers).join(", ")}};\n`;
 
 		code += "}\n";
 
-		/** @type {import("./Task.js").RunTaskReturn} */
+		/** @type {import("./Task.js").RunTaskReturn<TaskGenerateServicesCustomData>} */
 		const result = {
 			writeAssets: [
 				{
@@ -207,6 +281,9 @@ export class TaskGenerateServices extends Task {
 					fileData: code,
 				},
 			],
+			customData: {
+				usedAssets: Array.from(usedAssets),
+			},
 		};
 		return result;
 	}