search

iamshadmirza / react-native-design-system

A tiny design system
https://www.npmjs.com/package/react-native-design-system
MIT License
237 stars 32 forks source link

Fix docs bundle size #7

Open iamshadmirza opened 4 years ago

iamshadmirza commented 4 years ago

The storybook documentation is taking up 4.5 MB which is huge. I'm guessing the problem is with assets or react-native-vector-icons.
We are actually not using the package on the web as the icons are coming from the assets folder inside .storybook which is approx 1 MB. It would be great if we can avoid importing native specific modules on web and reduce the bundle size. Here is a link to webpack config file.

Something that might help

Documentation was initially a separate repo rnds_docs. Everything is same in these two repos and rnds_docs is generating 2.43 MB of bundle size. rnds_docs is actually a CRNA project using @storybook/react with react-native-web

Requirement

According to the storybook build warning, the size limit should be 244 kb. It would be great if we can bring this under 1 MB at least.

Problem

Build size is 4.5 MB

FDiskas commented 4 years ago

Use https://www.npmjs.com/package/webpack-bundle-analyzer

image

iamshadmirza commented 4 years ago

Use https://www.npmjs.com/package/webpack-bundle-analyzer

image

I tried. The bundle size is because of storybook. I'm thinking to migrate docs to something else. If you have a suggestion, please drop it here.

FDiskas commented 4 years ago

I was using https://github.com/styleguidist/react-styleguidist and looks like it also could work in your case :tshirt:

FDiskas commented 4 years ago

This working example could help https://github.com/MillerGregor/react-native-elements/blob/react-native-web/