fix: restore src-gen frontend production behavior

Restores the usage of 'require' in production mode when loading included modules. At the moment, both in development as well as in production mode, the frontend will be generated using the 'import' function. Webpack will use this opportunity for code splitting, leading to the generation of many small bundles. As they are sequentially loaded, this has a negative effect on the startup speed of the frontend. By using 'require' instead, wepack will produce a single bundle, which is faster to transmit without additional roundtrips. This behavior was used for production mode in all previous Theia versions and is now restored. Contributed on behalf of STMicroelectronics
eclipse-theia · Sep 27, 2023 · b4b4fce · b4b4fce
1 parent 7e3aa42
commit b4b4fce
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 5 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -7,6 +7,7 @@
 ## v1.42.0
 
 - [core] fixed logger level propagation when log config file changes at runtime [#12566](https://github.com/eclipse-theia/theia/pull/12566) - Contributed on behalf of STMicroelectronics
+- [dev-packages] restore src-gen frontend production behavior [12950](https://github.com/eclipse-theia/theia/pull/12950) - Contributed on behalf of STMicroelectronics
 - [vscode] stub TestController invalidateTestResults [#12944](https://github.com/eclipse-theia/theia/pull/12944) - Contributed by STMicroelectronics
 - [vscode] support iconPath in QuickPickItem [#12945](https://github.com/eclipse-theia/theia/pull/12945) - Contributed by STMicroelectronics
 - [vsx-registry] added a hint to extension fetching ENOTFOUND errors [#12858](https://github.com/eclipse-theia/theia/pull/12858) - Contributed by STMicroelectronics

diff --git a/dev-packages/application-manager/src/generator/frontend-generator.ts b/dev-packages/application-manager/src/generator/frontend-generator.ts
@@ -97,7 +97,7 @@ async function preload(parent) {
     container.parent = parent;
     try {
 ${Array.from(frontendPreloadModules.values(), jsModulePath => `\
-        await load(container, import('${jsModulePath}'));`).join(EOL)}
+        await load(container, ${this.importOrRequire()}('${jsModulePath}'));`).join(EOL)}
         const { Preloader } = require('@theia/core/lib/browser/preload/preloader');
         const preloader = container.get(Preloader);
         await preloader.initialize();
@@ -111,8 +111,8 @@ ${Array.from(frontendPreloadModules.values(), jsModulePath => `\
 
 module.exports = (async () => {
     const { messagingFrontendModule } = require('@theia/core/lib/${this.pck.isBrowser()
-            ? 'browser/messaging/messaging-frontend-module'
-            : 'electron-browser/messaging/electron-messaging-frontend-module'}');
+                ? 'browser/messaging/messaging-frontend-module'
+                : 'electron-browser/messaging/electron-messaging-frontend-module'}');
     const container = new Container();
     container.load(messagingFrontendModule);
     await preload(container);
@@ -125,9 +125,9 @@ module.exports = (async () => {
 
     try {
 ${Array.from(frontendModules.values(), jsModulePath => `\
-        await load(container, import('${jsModulePath}'));`).join(EOL)}
+        await load(container, ${this.importOrRequire()}('${jsModulePath}'));`).join(EOL)}
         await start();
-    } catch (reason) {
+    } catch (reason) {i
         console.error('Failed to start the frontend application.');
         if (reason) {
             console.error(reason);
@@ -142,6 +142,10 @@ ${Array.from(frontendModules.values(), jsModulePath => `\
 `;
     }
 
+    protected importOrRequire(): string {
+        return this.options.mode !== 'production' ? 'import' : 'require';
+    }
+
     /** HTML for secondary windows that contain an extracted widget. */
     protected compileSecondaryWindowHtml(): string {
         return `<!DOCTYPE html>