evanw/esbuild

Missing cross file constant folding causes Svelte (using `esm-env`) not tree-shakeable

Opened this issue · 1 comments

I know cross file constant folding is not supported since that only happens in the first stage where esbuild optimizes each file separately and links them later. I'm openning this issue just to notify that because of svelte using esm-env, its development code won't be tree-shaked in esbuild.

Usually packages use hard-coded process.env.NODE_ENV check to separate dev codes, like Vue, which works fine with esbuild's define option. It's not svelte's fault to use esm-env, but that seems could only make rollup win in bundling svelte into production.

For reference, here's the test to bundle a hello-world svelte component:

$ npm run test:prod

  dist/main.js   67.2kb
  dist/main.css   172b

⚡ Done in 28ms
./dist/main.js 67.152 kB
./dist/main.js - rollup 39.962 kB
./dist/main.js - rollup - esbuild 35.449 kB

Let me explain the size a little:

  1. Rollup tree-shakes the DEV variable and replaces if (DEV) { ... } with { ... } or simpliy ; (empty statement).
  2. esbuild further optimizes these statements.
  3. Vite should produce similar output because it effectively does the same thing.

The final output size differs about 32 kB on the svelte module. It might be less when using more svelte features or building large websites.

I'm linking this issue as they are very related