Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

NPM lib size list? #54

Open
GantMan opened this issue May 20, 2018 · 5 comments
Open

NPM lib size list? #54

GantMan opened this issue May 20, 2018 · 5 comments
Labels
help wanted Extra attention is needed 😎 Nice to Have Cool features we want question Further information is requested

Comments

@GantMan
Copy link
Owner

GantMan commented May 20, 2018

Perhaps this awesome table on the main readme should list the NPM costs?

image

I'm not sure that's a fair thing to list? Just thinking it will help kill all that dead space, heh.

@GantMan GantMan added the question Further information is requested label May 20, 2018
@msteckyefantis
Copy link
Contributor

I think that would be cool👌

@GantMan
Copy link
Owner Author

GantMan commented May 21, 2018

Doing this by hand is tedious. Automation is key.

Here's a plan that could work:
Create a file in each repo called NPMDep.json
Here, we list all the NPM dependencies that are required by npmjs name. Like so:

{
  "npmdeps": ["mobx", "mobx-react", "mobx-state-tree"]
}

We then write a script that will go into each folder, grab those deps, look up their versions in the lock files, and then use package-size to properly identify their sizes in a JSON file.

A second script can go around and look at those JSON files in each folder and then add links to https://bundlephobia.com/ in the readme while also listing the known sizes. The process is automated, so any updates to libraries would get reflected when the script is re-run (that is critical).

The result would be a table in the readme with all the size costs, and a link to verify such!!!

@solkimicreb
Copy link
Contributor

Bundlephobia has min and minzip badges, you could save some time and just use those.

Example:
minzipped bundle size

Raw markdown: [![minzipped bundle size](https://img.shields.io/bundlephobia/minzip/react.svg)](https://bundlephobia.com/result?p=react)

This displays the bundle size of the latest stable version on npm, you can add a locked version number ([email protected]) to the url too.

@GantMan
Copy link
Owner Author

GantMan commented May 30, 2018

very cool! I might work on this script this weekend. Thanks so much @solkimicreb

@GantMan GantMan added the help wanted Extra attention is needed label Jul 29, 2018
@GantMan GantMan added hacktoberfest-accepted Good for October credit in Hacktoberfest 😎 Nice to Have Cool features we want labels Oct 11, 2018
@GantMan
Copy link
Owner Author

GantMan commented Oct 11, 2018

I haven't started on this script, but labeling it for pickup by Hacktoberfest.

@GantMan GantMan removed the hacktoberfest-accepted Good for October credit in Hacktoberfest label Nov 3, 2018
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
help wanted Extra attention is needed 😎 Nice to Have Cool features we want question Further information is requested
Projects
None yet
Development

No branches or pull requests

3 participants