perf: Lazy-load public-api dependencies to reduce baseline memory usage (#5049)

* refactor: Load swagger and openapi dependencies conditionally

* disable public api in tests to reduce heal usage

* update the link and text in SettingsApiView when swagger ui is disabled

packages/cli/src/Interfaces.ts

@@ -531,6 +531,9 @@ export interface IPublicApiSettings {
 	enabled: boolean;
 	latestVersion: number;
 	path: string;
+	swaggerUi: {
+		enabled: boolean;
+	};
 }
 
 export interface IPackageVersions {

packages/cli/src/PublicApi/index.ts

@@ -3,27 +3,25 @@ import express, { Router } from 'express';
 import fs from 'fs/promises';
 import path from 'path';
 
-import * as OpenApiValidator from 'express-openapi-validator';
-import { HttpError } from 'express-openapi-validator/dist/framework/types';
-import { OpenAPIV3 } from 'openapi-types';
-import swaggerUi from 'swagger-ui-express';
-import validator from 'validator';
-import YAML from 'yamljs';
+import type { HttpError } from 'express-openapi-validator/dist/framework/types';
+import type { OpenAPIV3 } from 'openapi-types';
+import type { JsonObject } from 'swagger-ui-express';
 
 import config from '@/config';
 import * as Db from '@/Db';
 import { InternalHooksManager } from '@/InternalHooksManager';
 import { getInstanceBaseUrl } from '@/UserManagement/UserManagementHelper';
 
-function createApiRouter(
+async function createApiRouter(
 	version: string,
 	openApiSpecPath: string,
 	handlersDirectory: string,
 	swaggerThemeCss: string,
 	publicApiEndpoint: string,
-): Router {
+): Promise<Router> {
 	const n8nPath = config.getEnv('path');
-	const swaggerDocument = YAML.load(openApiSpecPath) as swaggerUi.JsonObject;
+	const YAML = await import('yamljs');
+	const swaggerDocument = YAML.load(openApiSpecPath) as JsonObject;
 	// add the server depending on the config so the user can interact with the API
 	// from the Swagger UI
 	swaggerDocument.server = [
@@ -33,21 +31,26 @@ function createApiRouter(
 	];
 	const apiController = express.Router();
 
-	apiController.use(
-		`/${publicApiEndpoint}/${version}/docs`,
-		swaggerUi.serveFiles(swaggerDocument),
-		swaggerUi.setup(swaggerDocument, {
-			customCss: swaggerThemeCss,
-			customSiteTitle: 'n8n Public API UI',
-			customfavIcon: `${n8nPath}favicon.ico`,
-		}),
-	);
+	if (!config.getEnv('publicApi.swaggerUi.disabled')) {
+		const { serveFiles, setup } = await import('swagger-ui-express');
 
-	apiController.use(`/${publicApiEndpoint}/${version}`, express.json());
+		apiController.use(
+			`/${publicApiEndpoint}/${version}/docs`,
+			serveFiles(swaggerDocument),
+			setup(swaggerDocument, {
+				customCss: swaggerThemeCss,
+				customSiteTitle: 'n8n Public API UI',
+				customfavIcon: `${n8nPath}favicon.ico`,
+			}),
+		);
+	}
 
+	const { default: validator } = await import('validator');
+	const { middleware } = await import('express-openapi-validator');
 	apiController.use(
 		`/${publicApiEndpoint}/${version}`,
-		OpenApiValidator.middleware({
+		express.json(),
+		middleware({
 			apiSpec: openApiSpecPath,
 			operationHandlers: handlersDirectory,
 			validateRequests: true,
@@ -131,10 +134,12 @@ export const loadPublicApiVersions = async (
 	const css = (await fs.readFile(swaggerThemePath)).toString();
 	const versions = folders.filter((folderName) => folderName.startsWith('v'));
 
-	const apiRouters = versions.map((version) => {
-		const openApiPath = path.join(__dirname, version, 'openapi.yml');
-		return createApiRouter(version, openApiPath, __dirname, css, publicApiEndpoint);
-	});
+	const apiRouters = await Promise.all(
+		versions.map(async (version) => {
+			const openApiPath = path.join(__dirname, version, 'openapi.yml');
+			return createApiRouter(version, openApiPath, __dirname, css, publicApiEndpoint);
+		}),
+	);
 
 	return {
 		apiRouters,

packages/cli/src/Server.ts

@@ -332,9 +332,12 @@ class App {
 				smtpSetup: isEmailSetUp(),
 			},
 			publicApi: {
-				enabled: config.getEnv('publicApi.disabled') === false,
+				enabled: !config.getEnv('publicApi.disabled'),
 				latestVersion: 1,
 				path: config.getEnv('publicApi.path'),
+				swaggerUi: {
+					enabled: !config.getEnv('publicApi.swaggerUi.disabled'),
+				},
 			},
 			workflowTagsDisabled: config.getEnv('workflowTagsDisabled'),
 			logLevel: config.getEnv('logs.level'),

packages/cli/src/config/index.ts

@@ -19,6 +19,9 @@ if (inE2ETests) {
 		EXTERNAL_FRONTEND_HOOKS_URLS: '',
 		N8N_PERSONALIZATION_ENABLED: 'false',
 	};
+}
+if (inTest) {
+	process.env.N8N_PUBLIC_API_DISABLED = 'true';
 } else {
 	dotenv.config();
 }

packages/cli/src/config/schema.ts

@@ -637,6 +637,14 @@ export const schema = {
 			env: 'N8N_PUBLIC_API_ENDPOINT',
 			doc: 'Path for the public api endpoints',
 		},
+		swaggerUi: {
+			disabled: {
+				format: Boolean,
+				default: false,
+				env: 'N8N_PUBLIC_API_SWAGGERUI_DISABLED',
+				doc: 'Whether to disable the Swagger UI for the Public API',
+			},
+		},
 	},
 
 	workflowTagsDisabled: {

packages/editor-ui/src/Interface.ts

@@ -796,6 +796,9 @@ export interface IN8nUISettings {
 		enabled: boolean;
 		latestVersion: number;
 		path: string;
+		swaggerUi: {
+			enabled: boolean;
+		};
 	};
 	onboardingCallPromptEnabled: boolean;
 	allowedModules: {
@@ -1204,6 +1207,9 @@ export interface ISettingsState {
 		enabled: boolean;
 		latestVersion: number;
 		path: string;
+		swaggerUi: {
+			enabled: boolean;
+		};
 	};
 	onboardingCallPromptEnabled: boolean;
 	saveDataErrorExecution: string;

packages/editor-ui/src/plugins/i18n/locales/en.json

@@ -1127,6 +1127,8 @@
 	"settings.api.view.info.webhook": "webhook node",
 	"settings.api.view.myKey": "My API Key",
 	"settings.api.view.tryapi": "Try it out using the",
+	"settings.api.view.more-details": "You can find more details in",
+	"settings.api.view.external-docs": "the API documentation",
 	"settings.api.view.error": "Could not check if an api key already exists.",
 	"settings.version": "Version",
 	"settings.usageAndPlan.title": "Usage and plan",

packages/editor-ui/src/stores/settings.ts

@@ -38,6 +38,9 @@ export const useSettingsStore = defineStore(STORES.SETTINGS, {
 			enabled: false,
 			latestVersion: 0,
 			path: '/',
+			swaggerUi: {
+				enabled: false,
+			},
 		},
 		onboardingCallPromptEnabled: false,
 		saveDataErrorExecution: 'all',
@@ -57,6 +60,9 @@ export const useSettingsStore = defineStore(STORES.SETTINGS, {
 		isPublicApiEnabled(): boolean {
 			return this.api.enabled;
 		},
+		isSwaggerUIEnabled(): boolean {
+			return this.api.swaggerUi.enabled;
+		},
 		publicApiLatestVersion(): number {
 			return this.api.latestVersion;
 		},
@@ -139,9 +145,7 @@ export const useSettingsStore = defineStore(STORES.SETTINGS, {
 			this.userManagement.enabled = settings.userManagement.enabled;
 			this.userManagement.showSetupOnFirstLoad = !!settings.userManagement.showSetupOnFirstLoad;
 			this.userManagement.smtpSetup = settings.userManagement.smtpSetup;
-			this.api.enabled = settings.publicApi.enabled;
-			this.api.latestVersion = settings.publicApi.latestVersion;
-			this.api.path = settings.publicApi.path;
+			this.api = settings.publicApi;
 			this.onboardingCallPromptEnabled = settings.onboardingCallPromptEnabled;
 		},
 		async getSettings(): Promise<void> {

packages/editor-ui/src/views/SettingsApiView.vue

@@ -48,10 +48,16 @@
 			</n8n-card>
 			<div :class="$style.hint">
 				<n8n-text size="small">
-					{{ $locale.baseText('settings.api.view.tryapi') }}
+					{{
+						$locale.baseText(`settings.api.view.${swaggerUIEnabled ? 'tryapi' : 'more-details'}`)
+					}}
 				</n8n-text>
-				<n8n-link :to="apiPlaygroundPath" :newWindow="true" size="small">
-					{{ $locale.baseText('settings.api.view.apiPlayground') }}
+				<n8n-link :to="apiDocsURL" :newWindow="true" size="small">
+					{{
+						$locale.baseText(
+							`settings.api.view.${swaggerUIEnabled ? 'apiPlayground' : 'external-docs'}`,
+						)
+					}}
 				</n8n-link>
 			</div>
 		</div>
@@ -78,9 +84,10 @@ import { mapStores } from 'pinia';
 import { useSettingsStore } from '@/stores/settings';
 import { useRootStore } from '@/stores/n8nRootStore';
 import { useUsersStore } from '@/stores/users';
+import { DOCS_DOMAIN } from '@/constants';
 
 export default mixins(showMessage).extend({
-	name: 'SettingsPersonalView',
+	name: 'SettingsApiView',
 	components: {
 		CopyInput,
 	},
@@ -89,7 +96,8 @@ export default mixins(showMessage).extend({
 			loading: false,
 			mounted: false,
 			apiKey: '',
-			apiPlaygroundPath: '',
+			swaggerUIEnabled: false,
+			apiDocsURL: '',
 		};
 	},
 	mounted() {
@@ -97,7 +105,10 @@ export default mixins(showMessage).extend({
 		const baseUrl = this.rootStore.baseUrl;
 		const apiPath = this.settingsStore.publicApiPath;
 		const latestVersion = this.settingsStore.publicApiLatestVersion;
-		this.apiPlaygroundPath = `${baseUrl}${apiPath}/v${latestVersion}/docs`;
+		this.swaggerUIEnabled = this.settingsStore.isSwaggerUIEnabled;
+		this.apiDocsURL = this.swaggerUIEnabled
+			? `${baseUrl}${apiPath}/v${latestVersion}/docs`
+			: `https://${DOCS_DOMAIN}/api/api-reference/`;
 	},
 	computed: {
 		...mapStores(useRootStore, useSettingsStore, useUsersStore),