翻译自 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的成本或麻烦。
其他精彩文章
来源:oschina
链接:https://my.oschina.net/u/2417355/blog/4944210