[uikit] Icon bundle size and tree shaking - Githubissues

pancakeswap / pancake-toolkit

:hammer_and_pick: Pancake frontend packages

https://pancakeswap-uikit.netlify.app/

GNU General Public License v3.0

305 stars 753 forks source link

[uikit] Icon bundle size and tree shaking #351

Closed 0xjojoex closed 2 years ago

0xjojoex commented 2 years ago

Icon takes half of the the uikit bundle size and it's not tree shakable right now. ~250kb

CleanShot 2021-12-02 at 16 02 14@2x

Because we re import all the icons here, webpack cannot tree shake the icon based on the router code splitting https://github.com/pancakeswap/pancake-toolkit/blob/d89126ebcaeed507ffd0d91c2a955a195ce4010f/packages/pancake-uikit/src/components/Svg/AnimatedIconComponent.tsx#L2 https://github.com/pancakeswap/pancake-toolkit/blob/d89126ebcaeed507ffd0d91c2a955a195ce4010f/packages/pancake-uikit/src/components/Svg/IconComponent.tsx#L2

TODO:

[ ] remove Icon component
[ ] menu config icon should accpet jsx instead of string

future plan:

Split icon to separated package

ghost commented 2 years ago

.

kamarel commented 2 years ago

Do you want me to work on it?