翻译自 Malcolm Laing
应该为你的应用选择哪个工具呢？
在 2021 年创建新的React项目时，有两个明确的选择：NextJS 或 Create-React-App。Gatsby 已经失宠了。
由于大规模构建缓慢，NextJS成为更好的静态站点生成器。
让我们回顾一下 NextJS 和 Create-React-App的优缺点，我们还将介绍哪些用例和场景更适合其中一个。
Create-React-App
Create-React-App是一个脚手架，它使我们能够为我们创建一个新的React应用程序。它将 webpack 和 babel 封装在一起，组成一个新的脚本工具 react-scripts 来管理整个应用，这样会减少很多复杂式，还有学习成本。
这意味着更新那些 “隐藏的” 依赖关系是一件容易的事。等待新版本的react脚本，然后进行更新。无需随意修复webpack配置的重大更改。
使用Create-React-App的优势
比较自由
欢迎您使用任何您喜欢的库，没有规则或建议，您可以使用任何您喜欢的路由库。
在客户端 render （渲染）
由于 Create-React-Apps 在客户端渲染，因此部署非常容易。
您可以将应用程序托管在任何文件主机上，如s3。客户端渲染的应用程序更易于使用和部署。
Create-React-App的缺点
很难定制。
如果您需要自定义Webpack配置，您唯一的选择是使用第三方工具，如craco或 eject(弹出，它本身提供的功能）。
一旦被弹出（eject），你就失去了使用Create-React-App的大部分好处。
抽象了复杂性。
如果你要做 Create-React-App 支持的事情，它可以工作得很好，否则会很复杂。
因为它通过隐藏babel和webpack 配置的复杂性，以致于 Create-React-App 可以轻松上手。
但是它阻止开发人员更多地了解这些重要工具是如何工作的。
对搜索引擎优化不好
由于它在客户端提渲染，它与搜索引擎优化作斗争，不应该用于电子商务或营销工作。
NextJS
将 NextJS 与 Create-React-App 进行比较几乎是不公平的，因为 使用 NextJS 的开发者要多得多。
因为 CRA 只是一个脚手架工具，但是 Nextjs 是一个构建 React 应用的框架。
开箱即用，它为您提供服务器端渲染、静态站点生成、无服务器功能等等。
它是一个工具箱，为您提供创建高性能web应用程序所需的一切。
使用NextJS的优势
快速。
由于服务器端渲染和静态站点生成，NextJS应用程序飞速发展。
为我们的应用进行许多性能优化，将性能作为默认设置。
它易于部署。
Vercel (NextJS背后的公司) 使部署全栈React应用程序变得容易。
只需点击几下，您就可以建立一个专业的部署管道。这包括预览部署和生产部署。
它为我们提供了API路由。
NextJS为我们提供了一种在应用程序中构建api的快速简便的方法。
如果您的应用程序使用第三方API，您通常需要自己的API来代理请求并对令牌保密，NextJS的API路由非常适合此用例。
易于定制。
NextJS允许我们自定义babel或webpack配置，添加webpack加载器或babel插件很容易。
使用NextJS的缺点
很固执
NextJS中只有一种处理路由的方法，您不能自定义它。
NextJS仅限于其基于文件的路由器，并且动态路由仅在与NodeJS服务器一起使用时才可能。
根据应用场合应当如何选择呢？
何时使用NextJS
当构建落地页面时
NextJS在制作落地页面和其他营销材料方面大放异彩。
当搜索引擎优化重要时。
在创建电子商务网站时，搜索引擎优化比以往任何时候都更加重要。
由于服务器端渲染，NextJS在这个技术大放异彩。
当建立这种网站时。
在服务器上渲染我们的应用程序可以减轻客户端渲染的负担。
对于使用较慢设备的用户，这可能导致更快的加载时间。
何时使用Create-React-App
构建后台应用时
如果您的应用程序仅对经过身份验证的用户可用，那么它将失去服务器端渲染的大部分好处。
对于此用例，客户端渲染的应用程序运行良好，并且更易于托管且更便宜。
构建 web 应用程序时。
Web应用程序通常从服务器端渲染中获益较少。
它们通常被重复使用的用户使用，我们可以使用缓存为它们提供闪电般的加载时间，而无需SSR的成本或麻烦。