adobe / spectrum-web-components

Spectrum Web Components
https://opensource.adobe.com/spectrum-web-components/
Apache License 2.0
1.3k stars 205 forks source link

Optimizing bundle size #4710

Open SavoInfostream opened 2 months ago

SavoInfostream commented 2 months ago

Code of conduct

Description of issue

Is there anything I need to be doing in order to decrease my bundle size? Half of my app size seems to be from Spectrum. I am not importing from bundle, but directly from specific packages. I am using light and medium packages for theme, I am importing only components that are needed, etc...

Here are some of the results of the esbuild analyzer theme (theme.css.js + scale-medium.css.js + theme-light.css.js) = 288.8 kB button = 54.4 kB slider = 49.2 kB

Is there any way for this size to be brought down?

SavoInfostream commented 2 months ago

I wrote a node script for processing output chunks which has removed unused css custom properties, rewrote rules which referenced undeclared variables, and minimized variable names. This had dropped more than 0.5MB from final size.

It is a bit better now, but still not great.