From 4de06e10d77bc8ec34d348b974530509f27e0ea9 Mon Sep 17 00:00:00 2001 From: Lucy Date: Sat, 29 Jun 2024 02:32:40 -0400 Subject: [PATCH] Improves tgui build speed (#79916) (#2452) Swaps out our minimizer, Terser, with esbuildplugin. This is the engine behind vite. This is a pretty straight forward replacement, let's let the numbers do the talking:
Test environment / My specs intel i7-13700kf 32GB RAM windows 11 intel 660p m.2 SSD asus 4080 TUF series
Fresh build Test steps: 1. Delete `tgui/.yarn/webpack` folder 2. `CTRL SHIFT B` Results: ![fresh](https://github.com/tgstation/tgstation/assets/42397676/f337366f-2260-41b7-9ad6-f81f6f78e9e7) terser averages `25.16s` esbuild averages `19.37s` - 23% faster
Cached build (assuming files are already there, CTRL SHIFT B if not) 1. add a comment to an interface file 2. `CTRL SHIFT B` Results: ![cached](https://github.com/tgstation/tgstation/assets/42397676/89dc1c4b-a5b4-436d-a7e2-86683b6168f4) terser averages `9s` esbuild averages `3.52s` - 60.91% faster
Faster dev environment N/A nothing player facing Co-authored-by: Jeremiah <42397676+jlsnow301@users.noreply.github.com> --- tgui/package.json | 2 +- tgui/webpack.config.js | 14 +- tgui/yarn.lock | 288 ++++++++++++++++++++++++++++++++++++++++- 3 files changed, 290 insertions(+), 14 deletions(-) diff --git a/tgui/package.json b/tgui/package.json index c38eb6f0dc2f..109c8b208ea4 100644 --- a/tgui/package.json +++ b/tgui/package.json @@ -38,6 +38,7 @@ "babel-plugin-transform-remove-console": "^6.9.4", "common": "workspace:*", "css-loader": "^5.2.7", + "esbuild-loader": "^4.0.2", "eslint": "^7.32.0", "eslint-config-prettier": "^8.5.0", "eslint-plugin-radar": "^0.2.1", @@ -53,7 +54,6 @@ "sass": "^1.37.5", "sass-loader": "^11.1.1", "style-loader": "^2.0.0", - "terser-webpack-plugin": "^5.1.4", "typescript": "^4.9.4", "url-loader": "^4.1.1", "webpack": "^5.75.0", diff --git a/tgui/webpack.config.js b/tgui/webpack.config.js index b096b2b3f4d8..cb26fc169fbf 100644 --- a/tgui/webpack.config.js +++ b/tgui/webpack.config.js @@ -144,17 +144,11 @@ module.exports = (env = {}, argv) => { // Production build specific options if (mode === 'production') { - const TerserPlugin = require('terser-webpack-plugin'); + const { EsbuildPlugin } = require('esbuild-loader'); config.optimization.minimizer = [ - new TerserPlugin({ - extractComments: false, - terserOptions: { - ie8: true, - output: { - ascii_only: true, - comments: false, - }, - }, + new EsbuildPlugin({ + target: 'ie8', + css: true, }), ]; } diff --git a/tgui/yarn.lock b/tgui/yarn.lock index ca5b987c50c0..a2d09f48104b 100644 --- a/tgui/yarn.lock +++ b/tgui/yarn.lock @@ -1323,6 +1323,167 @@ __metadata: languageName: node linkType: hard +"@esbuild/aix-ppc64@npm:0.21.5": + version: 0.21.5 + resolution: "@esbuild/aix-ppc64@npm:0.21.5" + conditions: os=aix & cpu=ppc64 + languageName: node + linkType: hard + +"@esbuild/android-arm64@npm:0.21.5": + version: 0.21.5 + resolution: "@esbuild/android-arm64@npm:0.21.5" + conditions: os=android & cpu=arm64 + languageName: node + linkType: hard + +"@esbuild/android-arm@npm:0.21.5": + version: 0.21.5 + resolution: "@esbuild/android-arm@npm:0.21.5" + conditions: os=android & cpu=arm + languageName: node + linkType: hard + +"@esbuild/android-x64@npm:0.21.5": + version: 0.21.5 + resolution: "@esbuild/android-x64@npm:0.21.5" + conditions: os=android & cpu=x64 + languageName: node + linkType: hard + +"@esbuild/darwin-arm64@npm:0.21.5": + version: 0.21.5 + resolution: "@esbuild/darwin-arm64@npm:0.21.5" + conditions: os=darwin & cpu=arm64 + languageName: node + linkType: hard + +"@esbuild/darwin-x64@npm:0.21.5": + version: 0.21.5 + resolution: "@esbuild/darwin-x64@npm:0.21.5" + conditions: os=darwin & cpu=x64 + languageName: node + linkType: hard + +"@esbuild/freebsd-arm64@npm:0.21.5": + version: 0.21.5 + resolution: "@esbuild/freebsd-arm64@npm:0.21.5" + conditions: os=freebsd & cpu=arm64 + languageName: node + linkType: hard + +"@esbuild/freebsd-x64@npm:0.21.5": + version: 0.21.5 + resolution: "@esbuild/freebsd-x64@npm:0.21.5" + conditions: os=freebsd & cpu=x64 + languageName: node + linkType: hard + +"@esbuild/linux-arm64@npm:0.21.5": + version: 0.21.5 + resolution: "@esbuild/linux-arm64@npm:0.21.5" + conditions: os=linux & cpu=arm64 + languageName: node + linkType: hard + +"@esbuild/linux-arm@npm:0.21.5": + version: 0.21.5 + resolution: "@esbuild/linux-arm@npm:0.21.5" + conditions: os=linux & cpu=arm + languageName: node + linkType: hard + +"@esbuild/linux-ia32@npm:0.21.5": + version: 0.21.5 + resolution: "@esbuild/linux-ia32@npm:0.21.5" + conditions: os=linux & cpu=ia32 + languageName: node + linkType: hard + +"@esbuild/linux-loong64@npm:0.21.5": + version: 0.21.5 + resolution: "@esbuild/linux-loong64@npm:0.21.5" + conditions: os=linux & cpu=loong64 + languageName: node + linkType: hard + +"@esbuild/linux-mips64el@npm:0.21.5": + version: 0.21.5 + resolution: "@esbuild/linux-mips64el@npm:0.21.5" + conditions: os=linux & cpu=mips64el + languageName: node + linkType: hard + +"@esbuild/linux-ppc64@npm:0.21.5": + version: 0.21.5 + resolution: "@esbuild/linux-ppc64@npm:0.21.5" + conditions: os=linux & cpu=ppc64 + languageName: node + linkType: hard + +"@esbuild/linux-riscv64@npm:0.21.5": + version: 0.21.5 + resolution: "@esbuild/linux-riscv64@npm:0.21.5" + conditions: os=linux & cpu=riscv64 + languageName: node + linkType: hard + +"@esbuild/linux-s390x@npm:0.21.5": + version: 0.21.5 + resolution: "@esbuild/linux-s390x@npm:0.21.5" + conditions: os=linux & cpu=s390x + languageName: node + linkType: hard + +"@esbuild/linux-x64@npm:0.21.5": + version: 0.21.5 + resolution: "@esbuild/linux-x64@npm:0.21.5" + conditions: os=linux & cpu=x64 + languageName: node + linkType: hard + +"@esbuild/netbsd-x64@npm:0.21.5": + version: 0.21.5 + resolution: "@esbuild/netbsd-x64@npm:0.21.5" + conditions: os=netbsd & cpu=x64 + languageName: node + linkType: hard + +"@esbuild/openbsd-x64@npm:0.21.5": + version: 0.21.5 + resolution: "@esbuild/openbsd-x64@npm:0.21.5" + conditions: os=openbsd & cpu=x64 + languageName: node + linkType: hard + +"@esbuild/sunos-x64@npm:0.21.5": + version: 0.21.5 + resolution: "@esbuild/sunos-x64@npm:0.21.5" + conditions: os=sunos & cpu=x64 + languageName: node + linkType: hard + +"@esbuild/win32-arm64@npm:0.21.5": + version: 0.21.5 + resolution: "@esbuild/win32-arm64@npm:0.21.5" + conditions: os=win32 & cpu=arm64 + languageName: node + linkType: hard + +"@esbuild/win32-ia32@npm:0.21.5": + version: 0.21.5 + resolution: "@esbuild/win32-ia32@npm:0.21.5" + conditions: os=win32 & cpu=ia32 + languageName: node + linkType: hard + +"@esbuild/win32-x64@npm:0.21.5": + version: 0.21.5 + resolution: "@esbuild/win32-x64@npm:0.21.5" + conditions: os=win32 & cpu=x64 + languageName: node + linkType: hard + "@eslint/eslintrc@npm:^0.4.3": version: 0.4.3 resolution: "@eslint/eslintrc@npm:0.4.3" @@ -3761,6 +3922,100 @@ __metadata: languageName: node linkType: hard +"esbuild-loader@npm:^4.0.2": + version: 4.2.0 + resolution: "esbuild-loader@npm:4.2.0" + dependencies: + esbuild: ^0.21.0 + get-tsconfig: ^4.7.0 + loader-utils: ^2.0.4 + webpack-sources: ^1.4.3 + peerDependencies: + webpack: ^4.40.0 || ^5.0.0 + checksum: feab2c1936e480b7c5108b5f16dae03c70abe8a4ea0f3268df3ff95295012dfefb0dac35780ee530ee788e9e2dcc4243e2cbb14537e2404c552e12e89653ea56 + languageName: node + linkType: hard + +"esbuild@npm:^0.21.0": + version: 0.21.5 + resolution: "esbuild@npm:0.21.5" + dependencies: + "@esbuild/aix-ppc64": 0.21.5 + "@esbuild/android-arm": 0.21.5 + "@esbuild/android-arm64": 0.21.5 + "@esbuild/android-x64": 0.21.5 + "@esbuild/darwin-arm64": 0.21.5 + "@esbuild/darwin-x64": 0.21.5 + "@esbuild/freebsd-arm64": 0.21.5 + "@esbuild/freebsd-x64": 0.21.5 + "@esbuild/linux-arm": 0.21.5 + "@esbuild/linux-arm64": 0.21.5 + "@esbuild/linux-ia32": 0.21.5 + "@esbuild/linux-loong64": 0.21.5 + "@esbuild/linux-mips64el": 0.21.5 + "@esbuild/linux-ppc64": 0.21.5 + "@esbuild/linux-riscv64": 0.21.5 + "@esbuild/linux-s390x": 0.21.5 + "@esbuild/linux-x64": 0.21.5 + "@esbuild/netbsd-x64": 0.21.5 + "@esbuild/openbsd-x64": 0.21.5 + "@esbuild/sunos-x64": 0.21.5 + "@esbuild/win32-arm64": 0.21.5 + "@esbuild/win32-ia32": 0.21.5 + "@esbuild/win32-x64": 0.21.5 + dependenciesMeta: + "@esbuild/aix-ppc64": + optional: true + "@esbuild/android-arm": + optional: true + "@esbuild/android-arm64": + optional: true + "@esbuild/android-x64": + optional: true + "@esbuild/darwin-arm64": + optional: true + "@esbuild/darwin-x64": + optional: true + "@esbuild/freebsd-arm64": + optional: true + "@esbuild/freebsd-x64": + optional: true + "@esbuild/linux-arm": + optional: true + "@esbuild/linux-arm64": + optional: true + "@esbuild/linux-ia32": + optional: true + "@esbuild/linux-loong64": + optional: true + "@esbuild/linux-mips64el": + optional: true + "@esbuild/linux-ppc64": + optional: true + "@esbuild/linux-riscv64": + optional: true + "@esbuild/linux-s390x": + optional: true + "@esbuild/linux-x64": + optional: true + "@esbuild/netbsd-x64": + optional: true + "@esbuild/openbsd-x64": + optional: true + "@esbuild/sunos-x64": + optional: true + "@esbuild/win32-arm64": + optional: true + "@esbuild/win32-ia32": + optional: true + "@esbuild/win32-x64": + optional: true + bin: + esbuild: bin/esbuild + checksum: 2911c7b50b23a9df59a7d6d4cdd3a4f85855787f374dce751148dbb13305e0ce7e880dde1608c2ab7a927fc6cec3587b80995f7fc87a64b455f8b70b55fd8ec1 + languageName: node + linkType: hard + "escalade@npm:^3.1.1": version: 3.1.1 resolution: "escalade@npm:3.1.1" @@ -4568,6 +4823,15 @@ __metadata: languageName: node linkType: hard +"get-tsconfig@npm:^4.7.0": + version: 4.7.5 + resolution: "get-tsconfig@npm:4.7.5" + dependencies: + resolve-pkg-maps: ^1.0.0 + checksum: e5b271fae2b4cd1869bbfc58db56983026cc4a08fdba988725a6edd55d04101507de154722503a22ee35920898ff9bdcba71f99d93b17df35dddb8e8a2ad91be + languageName: node + linkType: hard + "getpass@npm:^0.1.1": version: 0.1.7 resolution: "getpass@npm:0.1.7" @@ -6136,6 +6400,17 @@ __metadata: languageName: node linkType: hard +"loader-utils@npm:^2.0.4": + version: 2.0.4 + resolution: "loader-utils@npm:2.0.4" + dependencies: + big.js: ^5.2.2 + emojis-list: ^3.0.0 + json5: ^2.1.2 + checksum: a5281f5fff1eaa310ad5e1164095689443630f3411e927f95031ab4fb83b4a98f388185bb1fe949e8ab8d4247004336a625e9255c22122b815bb9a4c5d8fc3b7 + languageName: node + linkType: hard + "locate-path@npm:^5.0.0": version: 5.0.0 resolution: "locate-path@npm:5.0.0" @@ -7514,6 +7789,13 @@ __metadata: languageName: node linkType: hard +"resolve-pkg-maps@npm:^1.0.0": + version: 1.0.0 + resolution: "resolve-pkg-maps@npm:1.0.0" + checksum: 1012afc566b3fdb190a6309cc37ef3b2dcc35dff5fa6683a9d00cd25c3247edfbc4691b91078c97adc82a29b77a2660c30d791d65dab4fc78bfc473f60289977 + languageName: node + linkType: hard + "resolve@^1.14.2, resolve@^1.20.0, resolve@^1.9.0": version: 1.20.0 resolution: "resolve@npm:1.20.0" @@ -8379,7 +8661,7 @@ resolve@^2.0.0-next.3: languageName: node linkType: hard -"terser-webpack-plugin@npm:^5.1.3, terser-webpack-plugin@npm:^5.1.4": +"terser-webpack-plugin@npm:^5.1.3": version: 5.1.4 resolution: "terser-webpack-plugin@npm:5.1.4" dependencies: @@ -8519,6 +8801,7 @@ resolve@^2.0.0-next.3: babel-plugin-transform-remove-console: ^6.9.4 common: "workspace:*" css-loader: ^5.2.7 + esbuild-loader: ^4.0.2 eslint: ^7.32.0 eslint-config-prettier: ^8.5.0 eslint-plugin-radar: ^0.2.1 @@ -8534,7 +8817,6 @@ resolve@^2.0.0-next.3: sass: ^1.37.5 sass-loader: ^11.1.1 style-loader: ^2.0.0 - terser-webpack-plugin: ^5.1.4 typescript: ^4.9.4 url-loader: ^4.1.1 webpack: ^5.75.0 @@ -9136,7 +9418,7 @@ resolve@^2.0.0-next.3: languageName: node linkType: hard -"webpack-sources@npm:^1.1.0": +"webpack-sources@npm:^1.1.0, webpack-sources@npm:^1.4.3": version: 1.4.3 resolution: "webpack-sources@npm:1.4.3" dependencies: