服务器优先网页渲染

Question

在网页中渲染通常有三种方法：

• 服务器端呈现
• 客户端呈现
• 以上两种的组合

我有兴趣实施第三种方法，因为它至少在理论上结合了两者的优点：快速的首次加载和SEO优势，并且无需在每次点击按钮时都需要服务器请求。

抛开特定框架并关注概念，我想知道以下哪一项通常是最佳实践（理解每个用例都不同）：

• 首次访问时，与服务器端生成的HTML一起，异步加载所有JavaScript代码和在客户端呈现后续视图所需的所有空白模板。在每个新视图上，仅从服务器加载JSON并填充模板。
• 首次访问时，与服务器端生成的HTML一起，异步加载JavaScript路由代码。仅在请求新视图时加载模板和JSON。
• 首次访问时，与服务器端生成的HTML一起，异步加载JavaScript路由代码。在请求新视图时加载服务器端生成的部分HTML块。

我可能错了，但似乎大多数实现都使用第一种方法（加载所有内容），而不是在请求视图时加载templates / JSON的其他两种方法。如果这确实是最好的做法，为什么这比其他两种方法更好？

感谢。

Answer 1

这里有两个权衡取舍：

1）如果加载所有内容，初始加载可能会更慢;但如果按需加载，特定操作可能会变慢。

2）如果您加载了所有内容，您可以加载客户端最终不会使用的东西，这会浪费时间;但是如果你只在需要时加载每个元素，你可以额外往返服务器，这在感知性能方面可能更加昂贵。

如何衡量这些权衡取决于很多因素，例如预期的网络延迟与带宽，部分用户是否确实不太可能被某些用户访问等等。

一般情况下，如果我的应用程序已经需要2秒钟加载，我宁愿花费2.1秒而不是让后续操作也显示延迟。但是，如果我们谈论的是初始加载时间加倍的情况，也许我必须对此有不同的看法。同样，很多变量。

根据经验，我喜欢将模板，图像，脚本等捆绑到一个捆绑包中的想法 - 或者，如果有一个或多个子模块真的不会一直使用，也许是核心的一个捆绑和每个这样的子模块的捆绑。