Build time in react too long (10 min)

Viewed 2025

One of the react application takes too far a time to build production content.

contents of package.json as below

{
  "name": "app",
  "version": "1.0.0",
  "private": true,
  "dependencies": {
    "@date-io/date-fns": "^1.3.13",
    "@date-io/moment": "^1.3.13",
    "@material-ui/core": "^4.9.7",
    "@material-ui/icons": "^4.9.1",
    "@material-ui/lab": "^4.0.0-alpha.46",
    "@material-ui/pickers": "^3.2.10",
    "@testing-library/jest-dom": "^4.2.4",
    "@testing-library/react": "^9.3.2",
    "@testing-library/user-event": "^7.1.2",
    "@types/react": "^16.9.53",
    "axios": "0.19.2",
    "clsx": "^1.1.0",
    "currency-formatter": "^1.5.5",
    "date-fns": "^2.0.0-beta.5",
    "env-cmd": "^10.1.0",
    "file-saver": "^2.0.2",
    "human-format": "^0.11.0",
    "jwt-decode": "^2.2.0",
    "lodash": "^4.17.15",
    "material-table": "^1.69.1",
    "material-ui-chip-input": "^2.0.0-beta.2",
    "moment": "^2.24.0",
    "numeral": "^2.0.6",
    "password-validator": "^5.0.3",
    "plotly.js": "^1.53.0",
    "query-string": "^6.12.1",
    "react": "^16.13.1",
    "react-dom": "^16.13.1",
    "react-google-charts": "^3.0.15",
    "react-plotly.js": "^2.4.0",
    "react-preloaders": "^3.0.3",
    "react-redux": "^7.2.0",
    "react-router-dom": "^5.1.2",
    "react-scripts": "^3.4.3",
    "react-window": "^1.8.5",
    "redux": "^4.0.5",
    "redux-thunk": "^2.3.0",
    "validate.js": "^0.13.1",
    "xlsx": "^0.16.1"
  },
  "scripts": {
    "start": "env-cmd -f .env.development react-scripts --max_old_space_size=4096 start",
    "build": "react-scripts --max_old_space_size=4096 build",
    "build:prod": "env-cmd -f .env.production react-scripts --max_old_space_size=4096 build",
    "build:test": "env-cmd -f .env.test react-scripts --max_old_space_size=4096 build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  },
  "devDependencies": {
    "@material-ui/styles": "^4.10.0",
    "eslint-plugin-react": "^7.21.5"
  }
}

Also after following a thread on react in github actually started using the --max_old_space_size=4096 which is odd for some reason as I don't use it any other projects yet sharing nearly same amount of complexity. Other apps just build fine under 3 minutes all the time. However this particular project takes about 9-10 minutes to build a production content.

Things I have done so far: removed unused imports Imported only specific functions needed by the code. Build size still comes to 3MB and build time is about 10 min

0 Answers
Related