我试图找出NextJs和Create React App之间的区别。我知道两者都是为了让我们在使用ReactJs开发前端应用程序时更轻松。
在浏览了Google上的一些文章后,我发现主要的区别是
NextJs提供服务器端渲染(SSR),而Create React App提供客户端渲染(CSR),SSR提高了应用程序加载的性能。
但从发展Angular 来看,其他参数又如何呢
使用NextJS或CRA开发的Web应用程序的可维护性和可扩展性?
** typescript 和React挂钩/Redux支持**?
或者你甚至可以指导我,如果我做了一个错误的比较?
5条答案
按热度按时间js81xvg61#
我使用过NextJs和CRA。这两个框架都可以用来快速入门,并提供良好的开发者体验。然而,这两个框架都有各自的使用案例,其中任何一个都更出色。我将尝试基于其中的一些因素对它们进行比较。请随时提出修改建议,并添加其他要点或评论
服务器端呈现
| 监查员|Next.js|
| - ------|- ------|
| CRA不支持开箱即用的SSR。但是,您仍然可以对其进行配置。使用您喜欢的服务器和配置来设置SSR需要更多的工作。开发团队没有计划在不久的将来支持这一点。他们建议使用其他工具来解决这个问题。|NextJs有different types for SSR,它支持SSR开箱即用。* 静电产生:在构建时获取数据。这对于像博客或静态网站这样的用例效果最好* 服务器端渲染:为每个请求提取数据并呈现。2当你需要为不同的用户提供不同的视图时,你必须这样做。|
可配置性
我认为这是这些工具非常不同的一点,您的决定可能取决于此因素
| 监查员|Next.js|
| - ------|- ------|
| 创建React应用程序不会给您留下很多空间来配置它。无法更改Webpack配置等配置,除非偏离正常CRA方式(弹出、重写、重新接线、craco)。基本上,您必须使用中的配置
react-scripts
是CRA的核心。|几乎所有东西都是configurable。如果查看示例NextJs templates,您会看到类似以下的文件babelrc
、jest.config
、eslintrc
等您可以配置。|可维护性
| 监查员|Next.js|
| - ------|- ------|
| CRA非常固执。如果您不断更新CRA的版本,那么维护并不难。|NextJs也维护得很好,他们定期发布更新。|
typescript
| 监查员|Next.js|
| - ------|- ------|
| 支持开箱即用。您可以使用打印脚本初始化CRA应用程序
npx create-react-app my-app --template typescript
|Supports typescript开箱即用。从配置touch tsconfig.json
的 typescript 开始|挂钩支架
CRA和NextJs的最新版本都安装了支持钩子的React版本。您也可以轻松升级到最新版本
Redux支持
Redux是一个可以与这两种工具一起使用的库。
bwntbbo32#
Create React App只是一个React项目创建引擎,帮助您快速设置React项目。运行CRA脚本
npx create-react-app <appname>
后,您将获得一个可以运行的漂亮干净的单页面应用程序。在引擎盖下,您还可以获得babel、eslint、jest、webpack已经安装好了,所以这是开始React开发的一种非常方便的方式。如果你需要更多的控制这些工具的配置,您仍然可以使用npm run eject
。Next.js是一个基于React的框架,用于构建Node.js服务器端应用程序。这意味着您将使用相同的面向组件的逻辑来构建页面,并利用Next.js路由引擎进行页面到页面的导航。服务器端呈现将允许加载时间更分散。所以感知到的性能可能会更好。Redux也可以使用,但需要一些额外的步骤才能使其正常工作(请参见https://github.com/kirill-konshin/next-redux-wrapper)
无论您选择什么,最终都将是React编码。* 组件 *、JSX、*TypeScript支持 *、*React钩子 * 以及React的所有其他核心方面都将以任何方式得到支持。因此,您可以期望类似程度的可维护性。另一方面,可伸缩性取决于您的选择:如果您选择Next.js,您将在服务器基础设施上托管应用程序,该基础设施应根据您的受众调整大小,而使用CRA创建的React捆绑包只需静态托管在某个地方。
kqlmhetl3#
TLDR
最大的区别是两个项目的目的。JAM Stack或Static Site Generator创建React应用程序:是官方支持的创建单页React应用程序的方法。
解释:
这个难题对于许多开源项目来说都是真实的。看起来像是其他项目的替代品,但他们有关键的区别。例如,在这个例子中,虽然两个项目都使用ReactJS作为前端并产生webapps。他们解决的问题是非常不同的。在js中有一些重叠的功能主题/模板。但开发和未来的工作将是增强项目,使其有助于以更好的方式解决问题陈述。
即,NextJS将尝试包括是否开发了任何新的降价功能。CreateReactApps中不会出现这种情况。
建议
从你的问题,似乎你正在寻找这些项目开发React原生应用程序。所以我会建议去与创建React应用程序。
你的比较应该主要是这个项目是否与我正在解决的问题一致。2然后比较。3可维护性,可伸缩性, typescript 和React挂钩/Redux支持。
如果需要更多的信息做评论。
k4aesqcs4#
React只是一个JavaScript库,另一方面,Nextjs是一个React框架。SSR是Nextjs的优点之一,但还有许多其他的优点。Nextjs可以做react做的所有事情,最重要的是,它拥有react单独不具备的特性。请在这里查看Nextjs的文档:https://nextjs.org/docs/getting-started
7jmck4yq5#
ReactJs是一个库,NextJs是使用react组件的框架。