Fix twenty-front performances (#6744)

I have investigated the performance of our frontend vite build:
`npx nx run twenty:start` of `npx nx run twenty:build`

RAM usage:
- 160Mb: vite serve
- background typescript checker: 2.5GB
- background eslint checker: 3.5GB

I'm introducing two environment variables in FE .env to disable these
checkers on lower configuration (and to disable them from CD build):
```
# VITE_DISABLE_TYPESCRIPT_CHECKER=true
# VITE_DISABLE_ESLINT_CHECKER=true
```
This commit is contained in:
Charles Bochet
2024-08-26 16:35:09 +02:00
committed by GitHub
parent 55685d3c5b
commit 1d6a1f64c9
5 changed files with 18 additions and 8 deletions

View File

@@ -32,7 +32,7 @@
}, },
"start": { "start": {
"cache": true, "cache": true,
"dependsOn": ["^typecheck","^build"] "dependsOn": ["^build"]
}, },
"lint": { "lint": {
"executor": "@nx/eslint:lint", "executor": "@nx/eslint:lint",

View File

@@ -3,3 +3,5 @@ GENERATE_SOURCEMAP=false
# ———————— Optional ———————— # ———————— Optional ————————
# CHROMATIC_PROJECT_TOKEN= # CHROMATIC_PROJECT_TOKEN=
# VITE_DISABLE_TYPESCRIPT_CHECKER=true
# VITE_DISABLE_ESLINT_CHECKER=true

View File

@@ -5,7 +5,7 @@
"type": "module", "type": "module",
"scripts": { "scripts": {
"build": "npx vite build && sh ./scripts/inject-runtime-env.sh", "build": "npx vite build && sh ./scripts/inject-runtime-env.sh",
"build:sourcemaps": "VITE_BUILD_SOURCEMAP=true NODE_OPTIONS=--max-old-space-size=4096 npx nx build", "build:sourcemaps": "VITE_BUILD_SOURCEMAP=true VITE_DISABLE_TYPESCRIPT_CHECKER=true VITE_DISABLE_ESLINT_CHECKER=true NODE_OPTIONS=--max-old-space-size=4096 npx nx build",
"start:prod": "NODE_ENV=production npx vite --host", "start:prod": "NODE_ENV=production npx vite --host",
"tsup": "npx tsup" "tsup": "npx tsup"
}, },

View File

@@ -15,7 +15,12 @@ export default defineConfig(({ command, mode }) => {
/* /*
Using explicit env variables, there is no need to expose all of them (security). Using explicit env variables, there is no need to expose all of them (security).
*/ */
const { REACT_APP_SERVER_BASE_URL, VITE_BUILD_SOURCEMAP } = env; const {
REACT_APP_SERVER_BASE_URL,
VITE_BUILD_SOURCEMAP,
VITE_DISABLE_TYPESCRIPT_CHECKER,
VITE_DISABLE_ESLINT_CHECKER,
} = env;
const isBuildCommand = command === 'build'; const isBuildCommand = command === 'build';
@@ -24,13 +29,16 @@ export default defineConfig(({ command, mode }) => {
: path.resolve(__dirname, './tsconfig.dev.json'); : path.resolve(__dirname, './tsconfig.dev.json');
const checkers: Checkers = { const checkers: Checkers = {
typescript: {
tsconfigPath: tsConfigPath,
},
overlay: false, overlay: false,
}; };
if (!isBuildCommand) { if (VITE_DISABLE_TYPESCRIPT_CHECKER !== 'true') {
checkers['typescript'] = {
tsconfigPath: tsConfigPath,
};
}
if (VITE_DISABLE_ESLINT_CHECKER !== 'true') {
checkers['eslint'] = { checkers['eslint'] = {
lintCommand: lintCommand:
'eslint . --report-unused-disable-directives --max-warnings 0 --config .eslintrc.cjs', 'eslint . --report-unused-disable-directives --max-warnings 0 --config .eslintrc.cjs',

View File

@@ -22,7 +22,7 @@
}, },
"start": { "start": {
"executor": "nx:run-commands", "executor": "nx:run-commands",
"dependsOn": ["build"], "dependsOn": ["typecheck", "build"],
"options": { "options": {
"cwd": "packages/twenty-server", "cwd": "packages/twenty-server",
"command": "NODE_ENV=development && nest start --watch" "command": "NODE_ENV=development && nest start --watch"