如何比较 NextJS 和 Create-React-App 这两个工具

最新推荐文章于 2024-08-06 13:00:46 发布

程序员随风

最新推荐文章于 2024-08-06 13:00:46 发布

阅读量784

点赞数

分类专栏：文章分享文章标签： node.js reactjs javascript jquery typescript

本文链接：https://blog.csdn.net/weixin_39637597/article/details/113616416

版权

文章分享专栏收录该内容

37 篇文章 1 订阅

订阅专栏

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-q0anxspv-1612346030116)(https://pro.qiuzhi99.com/rails/active_storage/blobs/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaHBBWHM9IiwiZXhwIjpudWxsLCJwdXIiOiJibG9iX2lkIn19–402751b512aab646d7af5c19f07c947f3c7ca392/image.png)]

翻译自 Malcolm Laing

原文：https://medium.com/frontend-digest/whats-the-difference-between-nextjs-and-create-react-app-11b55650a612

应该为你的应用选择哪个工具呢？

在 2021 年创建新的React项目时，有两个明确的选择：NextJS 或 Create-React-App。Gatsby 已经失宠了。

由于大规模构建缓慢，NextJS成为更好的静态站点生成器。

让我们回顾一下 NextJS 和 Create-React-App的优缺点，我们还将介绍哪些用例和场景更适合其中一个。

Create-React-App

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-pLiBYyGI-1612346030119)(https://pro.qiuzhi99.com/rails/active_storage/blobs/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaHBBWHc9IiwiZXhwIjpudWxsLCJwdXIiOiJibG9iX2lkIn19–6e5477e738c1a3fad93a440edd5e3499304a8f96/image.png)]

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

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-msaY18xn-1612346030120)(https://pro.qiuzhi99.com/rails/active_storage/blobs/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaHBBWDA9IiwiZXhwIjpudWxsLCJwdXIiOiJibG9iX2lkIn19–fc872b71ced08b98005a69a9b266ba04ed4fe11d/image.png)]

将 NextJS 与 Create-React-App 进行比较几乎是不公平的，因为使用 NextJS 的开发者要多得多。

因为 CRA 只是一个脚手架工具，但是 Nextjs 是一个构建 React 应用的框架。

开箱即用，它为您提供服务器端渲染、静态站点生成、无服务器功能等等。

它是一个工具箱，为您提供创建高性能web应用程序所需的一切。