angular - Angular Universal 还是 SPA 吗？

Question

我已经阅读了几篇文章，其中一些是官方的 Angular Universal 页面、这里的介绍等。

我不完全理解 - Angular Universal 服务器是否仍然提供单个页面（一个巨大的 html 块），或者有没有办法配置 Angular Universal 以返回多个页面（一次应用程序的一部分）基于路线（请求/路线）？

如果路线不存在，最终目标是返回硬 404（但这超出了这个问题的范围，仅用于上下文）。

对我来说令人困惑的部分在这里：

这是因为与服务器端呈现的 HTML 一起，我们还将向浏览器发送一个普通的客户端 Angular 应用程序。

然后这个 Angular 客户端应用程序将接管页面，从那里开始一切都像普通的单页应用程序一样工作，这意味着所有运行时渲染都将像往常一样直接在客户端上发生。

那么，究竟是the server-side rendered HTML什么？它是预渲染的整个应用程序，还是以某种方式特定于用户请求的一个“路线”/视图/任何内容？

标签： angularangular-universal

Answer 1

TL;博士

• Angular Universal 将您的初始index.html页面作为预渲染的 html 文件提供，这样用户就没有（长）等待时间。
• 它还将整个 SPA 与初始预渲染一起发送index.html。
• 虽然用户可以立即开始与初始页面交互（例如index.html），但 SPA 在后台引导。
• 一旦 SPA 完成引导，它就会开始处理用户请求。

关于 SPA 的论述

Angular 和其他类似框架和/或库（例如 React）背后的意图是服务于称为单页应用程序（SPA）的东西。SPA 是在浏览器中运行的成熟应用程序，它可以自行呈现不同的页面，而无需与后端服务器交互。大多数情况下，它仅在请求可能在 SPA 中显示的附加数据时才与后端服务器通信。

引导 SPA 可能会很慢

虽然 SPA 非常棒，并且无需在每次用户导航到 Web 应用程序的另一个页面时从后端服务器请求文件，但 SPA 的初始启动时间可能非常慢（取决于客户端机器）和SPA 引导时可能会导致初始空白页或加载指示器。

角通用

为了通过查看旋转加载图标或空白页面来消除用户等待时间，Angular Universal 提供了index.html通过在后端预渲染来为应用程序的初始页面提供服务的可能性。此外，它将 Angular 应用程序（您的 SPA）与预渲染的index.html.

例子

例如，这可能是在后端预呈现并提供给用户的应用程序的登录页面。最后，用户可以立即开始与本示例中的登录页面进行交互，而您的 SPA 仍在用户浏览器的后台引导。并且在用户记住他的凭据时，SPA 已经完成了引导并为用户的所有未来请求提供服务。因此，用户不必盯着加载动画或空白页面，也不太可能放弃您的网页。