mirror of
https://github.com/twentyhq/twenty.git
synced 2026-06-11 17:37:18 -04:00
## Summary
Logic-function bundles produced by the twenty-sdk CLI were ~1.18 MB even
for a one-line handler. Root cause: the SDK shipped as a single bundled
barrel (`twenty-sdk` → `dist/index.mjs`) that co-mingled server-side
definition factories with the front-component runtime, validation (zod),
and React. With no `\"sideEffects\"` declaration on the SDK package,
esbuild had to assume every module-level statement could have side
effects and refused to drop unused code.
This PR restructures the SDK so consumers' bundlers can tree-shake at
the leaf level:
- **Reorganized SDK source.** All server-side definition factories now
live under `src/sdk/define/` (agents, application, fields,
logic-functions, objects, page-layouts, roles, skills, views,
navigation-menu-items, etc.). All front-component runtime
(components, hooks, host APIs, command primitives) lives under
`src/sdk/front-component/`. The legacy bare `src/sdk/index.ts` is
removed; the bare `twenty-sdk` entry no longer exists.
- **Split the build configs by purpose / runtime env.** Replaced
`vite.config.sdk.ts` with two purpose-specific configs:
- `vite.config.define.ts` — node target, externals from package
`dependencies`, emits to `dist/define/**`
- `vite.config.front-component.ts` — browser/React target, emits to
`dist/front-component/**`
Both use `preserveModules: true` so each leaf ships as its own `.mjs`.
- **\`\"sideEffects\": false\`** on `twenty-sdk` so esbuild can drop
unreferenced re-exports.
- **\`package.json\` exports + \`typesVersions\`** updated: dropped the
bare \`.\` entry, added \`./front-component\`, and pointed \`./define\`
at the new per-module dist layout.
- **Migrated every internal/example/community app** to the new subpath
imports (`twenty-sdk/define`, `twenty-sdk/front-component`,
`twenty-sdk/ui`).
- **Added \`bundle-investigation\` internal app** that reproduces the
bundle bloat and demonstrates the fix.
- Cleaned up dead \`twenty-sdk/dist/sdk/...\` references in the
front-component story builder, the call-recording app, and the SDK
tsconfig.
## Bundle size impact
Measured with esbuild using the same options as the SDK CLI
(\`packages/twenty-apps/internal/bundle-investigation\`):
| Variant | Imports | Before | After |
| ----------------------- |
------------------------------------------------------- | ---------- |
--------- |
| \`01-bare\` | \`defineLogicFunction\` from \`twenty-sdk/define\` |
1177 KB | **1.6 KB** |
| \`02-with-sdk-client\` | + \`CoreApiClient\` from
\`twenty-client-sdk/core\` | 1177 KB | **1.9 KB** |
| \`03-fetch-issues\` | + GitHub GraphQL fetch + JWT signing + 2
mutations | 1181 KB | **5.8 KB** |
| \`05-via-define-subpath\` | same as \`01\`, via the public subpath |
1177 KB | **1.7 KB** |
That's a ~735× reduction on the bare baseline. Knock-on benefits for
Lambda warm + cold starts, S3 upload size, and \`/tmp\` disk usage in
warm containers.
## Test plan
- [x] \`npx nx run twenty-sdk:build\` succeeds
- [x] \`npx nx run twenty-sdk:typecheck\` passes
- [x] \`npx nx run twenty-sdk:test:unit\` passes (31 files / 257 tests)
- [x] \`npx nx run-many -t typecheck
--projects=twenty-front,twenty-server,twenty-front-component-renderer,twenty-sdk,twenty-shared,bundle-investigation\`
passes
- [x] \`node
packages/twenty-apps/internal/bundle-investigation/scripts/build-variants.mjs\`
produces the sizes above
- [ ] CI green
Made with [Cursor](https://cursor.com)
81 lines
1.9 KiB
TypeScript
81 lines
1.9 KiB
TypeScript
import path from 'path';
|
|
import { type PackageJson } from 'type-fest';
|
|
import { defineConfig } from 'vite';
|
|
import tsconfigPaths from 'vite-tsconfig-paths';
|
|
|
|
import packageJson from './package.json';
|
|
|
|
export default defineConfig(() => {
|
|
return {
|
|
root: __dirname,
|
|
cacheDir: '../../node_modules/.vite/packages/twenty-sdk-node',
|
|
resolve: {
|
|
alias: {
|
|
'@/': path.resolve(__dirname, 'src') + '/',
|
|
},
|
|
},
|
|
plugins: [
|
|
tsconfigPaths({
|
|
root: __dirname,
|
|
}),
|
|
],
|
|
build: {
|
|
emptyOutDir: false,
|
|
outDir: 'dist',
|
|
lib: {
|
|
entry: {
|
|
cli: 'src/cli/cli.ts',
|
|
operations: 'src/cli/operations/index.ts',
|
|
'front-component-renderer/build':
|
|
'src/front-component-renderer/build/index.ts',
|
|
},
|
|
name: 'twenty-sdk',
|
|
},
|
|
rollupOptions: {
|
|
external: (id: string) => {
|
|
if (/^node:/.test(id)) {
|
|
return true;
|
|
}
|
|
|
|
const builtins = [
|
|
'child_process',
|
|
'crypto',
|
|
'fs',
|
|
'fs/promises',
|
|
'module',
|
|
'os',
|
|
'path',
|
|
'stream',
|
|
'url',
|
|
'util',
|
|
];
|
|
|
|
if (builtins.includes(id)) {
|
|
return true;
|
|
}
|
|
|
|
const deps = Object.keys(
|
|
(packageJson as PackageJson).dependencies || {},
|
|
);
|
|
|
|
return deps.some((dep) => id === dep || id.startsWith(dep + '/'));
|
|
},
|
|
output: [
|
|
{
|
|
format: 'es' as const,
|
|
entryFileNames: '[name].mjs',
|
|
},
|
|
{
|
|
format: 'cjs' as const,
|
|
interop: 'auto' as const,
|
|
esModule: true,
|
|
exports: 'named' as const,
|
|
entryFileNames: '[name].cjs',
|
|
},
|
|
],
|
|
},
|
|
},
|
|
logLevel: 'warn' as const,
|
|
};
|
|
});
|