iamshadmirza / iamshadmirza/react-native-design-system

Fix docs bundle size

Open
#7 4 comments 0 reactions 0 assignees View on GitHub
help wanted
Dominant language
JavaScript
Stars
240
Forks
31
PR merge metrics
No merged PRs in 30d

Description

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](https://github.com/iamshadmirza/react-native-design-system/blob/master/.storybook/webpack.config.js) to webpack config file.

## Something that might help
Documentation was initially a separate repo [rnds_docs](https://github.com/iamshadmirza/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

Contributor guide

Open the contributing guide

Research direction

Start with .storybook/webpack.config.js and inspect how the Storybook documentation build includes native modules and the .storybook/assets folder. Compare the result with the rnds_docs bundle and the Storybook build warning. Done means reducing the documentation bundle from 4.5 MB to under 1 MB.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, react-native
Domain
build-system, documentation
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.