Add option to minimize server bundle size

Author: fwang

.changeset/lemon-trains-fry.md

@@ -0,0 +1,5 @@
+---
+"open-next": patch
+---
+
+Add option to minimize server bundle size

README.md

@@ -314,6 +314,18 @@ AWS link: https://d1gwt3w78t4dm3.cloudfront.net
 
 Vercel link: https://open-next.vercel.app
 
+## Advanced usage
+
+#### OPEN_NEXT_MINIMIZE
+
+Enabling this option will minimize all `.js` and `.json` files in the server function bundle using the [node-minify](https://github.com/srod/node-minify) library. This can reduce the size of the server function bundle by about 40%, depending on the size of your app. To enable it, simply run:
+
+```bash
+OPEN_NEXT_MINIMIZE=true open-next build
+```
+
+Enabling this option can significantly help to reduce the cold start time of the server function. However, it's an **experimental feature**, and you need to opt-in to use it. Once this option is thoroughly tested and found to be stable, it will be enabled by default.
+
 ## Debugging
 
 To find the **server and image optimization log**, go to the AWS CloudWatch console in the **region you deployed to**.
@@ -339,9 +351,9 @@ It is recommended to **turn off debug mode when building for production** becaus
 1. Un-minified function code is 2-3X larger than minified code. This will result in longer Lambda cold start times.
 1. Logging the event object on each request can result in a lot of logs being written to AWS CloudWatch. This will result in increased AWS costs.
 
-## Opening an issue
+#### Opening an issue
 
-To open an issue, create a pull request (PR) and add a new page to the [benchmark app](#example) in `example` folder that demonstrate the issue.
+To help diagnose issues, it's always helpful to provide a reproducible setup when opening an issue. One easy way to do this is to create a pull request (PR) and add a new page to the [benchmark app](#example) located in the `example` folder, which reproduces the issue. The PR will automatically deploy the app to AWS.
 
 ## Contribute
 

packages/open-next/package.json

@@ -21,8 +21,11 @@
   "author": "",
   "dependencies": {
     "@aws-sdk/client-s3": "^3.234.0",
+    "@node-minify/core": "^8.0.6",
+    "@node-minify/terser": "^8.0.6",
     "@tsconfig/node18": "^1.0.1",
     "esbuild": "^0.15.18",
+    "promise.series": "^0.2.0",
     "yargs": "^17.6.2"
   },
   "devDependencies": {

packages/open-next/src/build.ts

@@ -2,6 +2,7 @@ import fs from "node:fs";
 import url from "node:url";
 import path from "node:path";
 import cp from "node:child_process";
+import { minifyAll } from "./minimize-js.js";
 import { buildSync, BuildOptions } from "esbuild";
 
 const __dirname = url.fileURLToPath(new URL(".", import.meta.url));
@@ -31,6 +32,9 @@ export async function build() {
   createServerBundle(monorepoRoot);
   createImageOptimizationBundle();
   createAssets();
+  if (process.env.OPEN_NEXT_MINIFY) {
+    await minifyServerBundle();
+  }
 }
 
 function checkRunningInsideNextjsApp() {
@@ -205,6 +209,14 @@ function createServerBundle(monorepoRoot: string) {
   );
 }
 
+async function minifyServerBundle() {
+  console.info(`Minimizing server function...`);
+  await minifyAll(path.join(outputDir, "server-function"), {
+    compress_json: true,
+    mangle: true,
+  });
+}
+
 function createImageOptimizationBundle() {
   console.info(`Bundling image optimization function...`);
 

packages/open-next/src/minimize-js.ts

@@ -0,0 +1,91 @@
+// Copied and modified from node-minify-all-js by Adones Pitogo
+// https://github.com/adonespitogo/node-minify-all-js/blob/master/index.js
+
+// @ts-nocheck
+import fs from "node:fs/promises";
+import path from "node:path";
+import promiseSeries from "promise.series";
+import minify from "@node-minify/core";
+import terser from "@node-minify/terser";
+
+var failed_files = [];
+var total_files = 0;
+var options = {};
+
+const minifyJS = async (file) => {
+  total_files++;
+  try {
+    await minify({
+      compressor: terser,
+      input: file,
+      output: file,
+      options: {
+        module: options.module,
+        mangle: options.mangle,
+        compress: { reduce_vars: false },
+      },
+    });
+  } catch (e) {
+    failed_files.push(file);
+  }
+  //process.stdout.write(".");
+};
+
+const minifyJSON = async (file) => {
+  try {
+    if (options.compress_json || options.packagejson) {
+      total_files++;
+      var is_package_json = file.indexOf("package.json") > -1;
+      var data = await fs.readFile(file, "utf8");
+      var json = JSON.parse(data);
+      var new_json = {};
+      if (options.packagejson && is_package_json) {
+        var { name, version, bin, main, binary, engines } = json;
+        new_json = { name, version };
+        if (bin) new_json.bin = bin;
+        if (binary) new_json.binary = binary;
+        if (main) new_json.main = main;
+        if (engines) new_json.engines = engines;
+      } else {
+        new_json = json;
+      }
+      await fs.writeFile(file, JSON.stringify(new_json));
+    }
+  } catch (e) {}
+  //process.stdout.write(".");
+};
+
+const walk = async (currentDirPath) => {
+  var js_files = [];
+  var json_files = [];
+  var dirs = [];
+  var current_dirs = await fs.readdir(currentDirPath);
+  for (const name of current_dirs) {
+    var filePath = path.join(currentDirPath, name);
+    var stat = await fs.stat(filePath);
+    var is_bin = /\.bin$/;
+    if (stat.isFile()) {
+      if (filePath.substr(-5) === ".json") json_files.push(filePath);
+      else if (filePath.substr(-3) === ".js" || options.all_js)
+        js_files.push(filePath);
+    } else if (stat.isDirectory() && !is_bin.test(filePath)) {
+      dirs.push(filePath);
+    }
+  }
+  var js_promise = Promise.all(js_files.map((f) => minifyJS(f)));
+  var json_promise = Promise.all(json_files.map((f) => minifyJSON(f)));
+  await Promise.all([js_promise, json_promise]);
+  await promiseSeries(dirs.map((dir) => () => walk(dir)));
+};
+
+export async function minifyAll(dir, opts) {
+  Object.assign(options, opts || {});
+  //console.log("minify-all-js options:\n", JSON.stringify(options, null, 2));
+  await walk(dir);
+  //process.stdout.write(".\n");
+  //console.log("Total found files: " + total_files);
+  if (failed_files.length) {
+    console.log(`\n\nFailed to minify files:`);
+    failed_files.forEach((f) => console.log("\t" + f));
+  }
+}