1

I'm learning React and building an app that is in it's infancy at the moment, but I plan to make useful. I've found though, that my bundle.js file is growing fast, and I'm not sure why. I thought that even a medium sized web app would be under a meg of js.

When I added 'moment', I noticed a large jump in size. Then 'random-key' and 'recharts' were big additions. Using webpack with -p gives me around a 1.2Meg bundle.js, while without the -p, I'm looking at 3.5meg.

I'm satrting to think I am mucking up my devDependencies and my dependencies. How do you know what should be a devDependency (--save-dev) vs a dependency (--save)?

Looking at the list below, should I move stuff around?

  "license": "ISC",
  "dependencies": {
    "react": "^16.2.0",
    "react-dom": "^16.2.0"
  },
  "devDependencies": {
    "babel-core": "^6.26.0",
    "babel-loader": "^7.1.4",
    "babel-plugin-transform-object-rest-spread": "^6.26.0",
    "babel-preset-env": "^1.6.1",
    "babel-preset-react": "^6.24.1",
    "css-loader": "^0.28.7",
    "file-loader": "^1.1.5",
    "html-webpack-plugin": "^3.0.6",
    "moment": "^2.21.0",
    "random-key": "^0.3.2",
    "react-modal": "^3.3.2",
    "react-moment": "^0.7.0",
    "react-router": "^4.2.0",
    "react-router-dom": "^4.2.2",
    "react-toastify": "^3.4.2",
    "recharts": "^1.0.0-beta.10",
    "redux": "^3.7.2",
    "style-loader": "^0.19.0",
    "svg-react-loader": "^0.4.5",
    "url-loader": "^0.6.2",
    "webpack": "^3.10.0",
    "webpack-dev-server": "^2.9.7"
  }

What in there should move/be removed, and how do you decide what should go in each group?

Craig
  • 18,074
  • 38
  • 147
  • 248
  • "meg"? are you perhaps from electrical engineering background? :) – Kos Mar 19 '18 at 08:54
  • the linked question should help but please note that `moment` is super heavy because it comes with a large database of timezone and DST information. I think you can find a lighter version... You an also make your bundle size smaller by lazy-loading some libraries when needed. – Kos Mar 19 '18 at 08:56
  • dependencies are required to run, devDependencies only to develop, – Abslen Char Mar 19 '18 at 08:57

0 Answers0