react可以后端(Next.js 和 React 有哪些区别?)

react可以后端(Next.js 和 React 有哪些区别?)

大家好,关于react可以后端很多朋友都还不太明白,今天小编就来为大家分享关于react可以后端的知识,希望对各位有所帮助!



嗯,让我解释一下。

Next.js 是一个基于 React 的后端框架。

我们在 React 中能做的一切,在 Next.js 中也能做,还有一些额外的功能,如路由、API 调用、认证等等。我们在 React 中没有这些功能。相反,我们必须安装一些外部库和依赖项。例如,React Router 用于单页 React 应用程序的路由。

react可以后端(Next.js 和 React 有哪些区别?)

但在 Next.js 中,情况就不同了。我们不需要依赖外部库来完成这些事情。当我们创建一个 Next.js 应用程序时,它们就被内置在软件包中。

这就是 Next.js 应用与传统 React 应用不同的主要原因。

另一方面,服务器是我们看不到的东西。它是代码的后端,或服务器代码。

React 和 CSR 如何工作

因此,当我们加载一个 React 应用程序时,或者当它被安装后,我们在浏览器中检查源代码,我们会得到这样的东西:

React 源代码

如果你简化它,我们得到以下结果:

如果你看一下用户界面中的输出,它将是这样的:

React 应用

在这个页面的源代码中,我们只得到几行代码,其中包括标题、 meta 标签和链接参考(link references)。

但在 body 中,我们只有以下内容:

每当我们加载一个 React 应用程序,所有的 UI 组件都会在浏览器上动态生成。

如果你做了我们之前做的同样的事情,但用 Next.js 应用程序,你会得到不同的东西:

现在,这是一个简单的 Next.js 应用程序的源代码。我们看到整个内容,如 HTML、CSS 和 JavaScript。

这意味着,当 Next.js 应用程序加载时,我们在用户界面上看到的网络上的内容已经生成。而这是在服务器上发生的。这是因为 Next.js 利用了服务器端渲染(或 SSR),也被称为预渲染。

服务器端渲染(或预渲染)使应用程序的加载速度加快。这是因为我们将要看到的输出已经在服务器端生成。它不需要在浏览器上生成。这使得应用更快。

感谢阅读!

如果你想观看本博客的视频版本,你可以在这里找到它:Next.js 框架课程--Next.js 的预渲染(Pre-Rendering)。

如果你想进一步了解 Next.js,我正在建立一个关于它的课程。这是一个播放列表,你将在其中学习所有这些 Next.js 的东西。它仍在进行中。请看这里:

译者:luojiyin

好了,本文到此结束,如果可以帮助到大家,还望关注本站哦!

文章版权声明:除非注明,否则均为边学边练网络文章,版权归原作者所有