From b15ae21c45cd1c2577f673854a862059a0c8eb95 Mon Sep 17 00:00:00 2001
From: pengx17 <pengxiao@outlook.com>
Date: Sat, 30 Mar 2024 09:06:09 +0000
Subject: [PATCH] fix(electron): optimize bundle size by removing unused
 dependencies (#6415)

Should greatly reduce the size of helper.js and could speed up the time on starting the client app.

fix https://github.com/toeverything/AFFiNE/issues/6312

Before:

![image.png](https://graphite-user-uploaded-assets-prod.s3.amazonaws.com/T2klNLEk0wxLh4NRDzhk/681d6766-7d48-4574-b791-49e2c0ae6e1b.png)

After:
![image.png](https://graphite-user-uploaded-assets-prod.s3.amazonaws.com/T2klNLEk0wxLh4NRDzhk/ab13e624-7e03-407d-9538-3b9452694402.png)
---
 .../frontend/electron/scripts/build-layers.ts | 17 ++++++++++--
 packages/frontend/electron/scripts/common.ts  | 26 +++++++++++++++++--
 2 files changed, 39 insertions(+), 4 deletions(-)

diff --git a/packages/frontend/electron/scripts/build-layers.ts b/packages/frontend/electron/scripts/build-layers.ts
index 99fa73cbf2fe8..0d76f6c1f8938 100644
--- a/packages/frontend/electron/scripts/build-layers.ts
+++ b/packages/frontend/electron/scripts/build-layers.ts
@@ -1,6 +1,9 @@
+import fs from 'node:fs/promises';
+import path from 'node:path';
+
 import * as esbuild from 'esbuild';
 
-import { config, mode } from './common';
+import { config, mode, rootDir } from './common';
 
 async function buildLayers() {
   const common = config();
@@ -16,10 +19,20 @@ async function buildLayers() {
       `"${process.env.BUILD_TYPE_OVERRIDE}"`;
   }
 
-  await esbuild.build({
+  const metafile = process.env.METAFILE;
+
+  const result = await esbuild.build({
     ...common,
     define: define,
+    metafile: !!metafile,
   });
+
+  if (metafile) {
+    await fs.writeFile(
+      path.resolve(rootDir, `metafile-${Date.now()}.json`),
+      JSON.stringify(result.metafile, null, 2)
+    );
+  }
 }
 
 await buildLayers();
diff --git a/packages/frontend/electron/scripts/common.ts b/packages/frontend/electron/scripts/common.ts
index 5711c74657551..b62f6b54496a6 100644
--- a/packages/frontend/electron/scripts/common.ts
+++ b/packages/frontend/electron/scripts/common.ts
@@ -4,7 +4,7 @@ import { fileURLToPath } from 'node:url';
 // eslint-disable-next-line @typescript-eslint/no-restricted-imports
 import { getRuntimeConfig } from '@affine/cli/src/webpack/runtime-config';
 import { sentryEsbuildPlugin } from '@sentry/esbuild-plugin';
-import type { BuildOptions } from 'esbuild';
+import type { BuildOptions, Plugin } from 'esbuild';
 
 export const electronDir = fileURLToPath(new URL('..', import.meta.url));
 
@@ -33,7 +33,7 @@ export const config = (): BuildOptions => {
     define['process.env.GITHUB_SHA'] = `"${process.env.GITHUB_SHA}"`;
   }
 
-  const plugins = [];
+  const plugins: Plugin[] = [];
 
   if (
     process.env.SENTRY_AUTH_TOKEN &&
@@ -49,6 +49,28 @@ export const config = (): BuildOptions => {
     );
   }
 
+  plugins.push({
+    name: 'no-side-effects',
+    setup(build) {
+      build.onResolve({ filter: /\.js/ }, async args => {
+        if (args.pluginData) return; // Ignore this if we called ourselves
+
+        const { path, ...rest } = args;
+
+        // mark all blocksuite packages as side-effect free
+        // because they will include a lot of files that are not used in node_modules
+        if (rest.resolveDir.includes('blocksuite')) {
+          rest.pluginData = true; // Avoid infinite recursion
+          const result = await build.resolve(path, rest);
+
+          result.sideEffects = false;
+          return result;
+        }
+        return null;
+      });
+    },
+  });
+
   return {
     entryPoints: [
       resolve(electronDir, './src/main/index.ts'),