Next 12客户端路由与Next 13以服务器为中心路由之间的区别

rn0zuynd  于 2023-02-22  发布在  其他
关注(0)|答案(1)|浏览(239)

在Next 13的文档中,它是这样说的:
与使用客户端路由的pages目录不同,app目录中的新路由器使用以服务器为中心的路由,以与服务器组件和服务器上的数据提取保持一致。客户机不必下载路由图,并且可以使用对服务器组件的相同请求来查找路由。此优化对所有应用程序都有用,但对具有许多路由的应用程序影响较大。虽然路由是以服务器为中心的,路由器使用具有链接组件的客户端导航-类似于单页应用程序的行为。
请有人能更详细地解释一下客户端路由和以服务器为中心的路由之间的区别吗?在我看来,在这两种情况下,组件都呈现在服务器上,客户端获得HTML并与JS水合。除了如何获取数据外,我不确定有什么区别。

pzfprimi

pzfprimi1#

在服务器呈现的组件中,整个组件在服务器上构建,然后发送到客户端。服务器不发送任何JavaScript包,任何依赖项,客户端也不解析任何内容。服务器将完成并将其发送到浏览器,浏览器只会将其显示给用户。
这就是为什么当您决定哪些组件应该是服务器端呈现的组件还是客户端呈现的组件时,您需要查看组件,看看组件是否具有某种用户交互性,例如按钮单击。如果存在可单击组件,该组件应当由浏览器呈现,因为浏览器必须知道一旦点击事件发生如何处理点击的逻辑。服务器将发送给客户端相关的js代码。
因为你的组件是呈现在服务器上的,所以从数据库中获取数据会更容易。因为你的服务器不会发送任何沉重的库到客户端,(浏览器必须解析javascript,而解析总是需要s时间)这提高了性能,初始加载会显著加快。
在app目录中,您仍然可以使用页面顶部带有use client指令的客户端组件,但总体目标应该是使用少量的客户端组件。我们的目标是最小化用户等待时间。

相关问题