javascript - 为什么有这么多依赖项？

Question

React 应用程序中的所有这些依赖项如何不影响性能？

我对框架的 javascript 开发很陌生(准确地说是 React)。目前正在构建一个全栈应用程序。我仍在前端工作，package.json 看起来已经很填充了。我很享受这个，但我一直在思考它在生产中可能产生的影响。并且节点模块在生产中被排除(.gitignore)，那么应用程序在部署时依赖什么？

{
  "name": "smart-brain",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "clarifai": "^2.9.1",
    "react": "^16.9.0",
    "react-dom": "^16.9.0",
    "react-particles-js": "^2.7.0",
    "react-scripts": "3.1.2",
    "react-tilt": "^0.1.4",
    "tachyons": "^4.11.1"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts 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"
    ]
  }
}

Answer 1

首先，让我首先声明，仅仅因为 node_modules 列在 .gitignore 中并不意味着它被排除在生产环境之外。您需要在生产环境中的 package.json 文件中安装 "dependency" 下列出的软件包(通过 npm install --only=product )在运行节点应用程序之前。

此外，当您通过 npm install -D [package name] 安装软件包时，您可能会看到 “devDependency”，这些是您在开发中使用的软件包。在开发过程中，您通常会通过 npm install 安装 package.json 文件中列出的所有软件包，但您只需要 “依赖项”< 下列出的软件包 通过运行 npm install --only=product 进入生产环境。

其次，包的数量与运行时性能没有直接关系。它可能会对您的应用程序启动时间产生很小的影响，因为它需要加载包(假设您在应用程序中使用它们)，但这几乎不是任何人关心的问题。此外，为了解决您对大量依赖项的担忧，每个包通常都旨在解决一个问题——例如身份验证、验证、日期/时间操作、渲染等——因此您可能会在一个包中看到大量依赖项。典型的节点网络应用程序。然而，对于大多数节点开发人员来说，node_modules 的大小并不是什么大问题，但由于它的大小，甚至有关于它的模因。但同样，这只是存储大小而不是性能的问题。