我应该使用 JavaScript 还是服务器来呈现这个模板？答案

【问题标题】：Should I render this template using JavaScript or the server?我应该使用 JavaScript 还是服务器来呈现这个模板？
【发布时间】：2011-12-04 00:03:33
【问题描述】：

我正在呈现新闻提要。

我打算将 Backbone.js 用于我的 javascript 内容，因为我厌倦了使用 JQuery 进行手动 DOM 绑定。

所以现在我正在考虑 2 个选项。

当用户加载页面时，“新闻提要”容器是空白的。但是该页面触发了一个 javascript，它将新闻提要的项目呈现到屏幕上。这将与 Backbone 的模型和集合等相关。
当用户加载页面时，“新闻提要”由服务器呈现。即使关闭了 javascript，项目仍然会显示，因为服务器通过模板引擎呈现它。

我想使用 Backbone.js 来保持我的 javascript 干净。所以，我应该选择#1，对吧？？但是＃1比＃2复杂得多。

顺便说一句，我问这个问题的原因是因为我不想使用 Backbone.js 的路由功能。我会单独加载每个页面，并将 Backbone 用于页面的各个项目。换句话说，我在中途使用 Backbone.js。

如果我要使用 Backbone.js 的路由功能，那么显而易见的答案就是 #1，对吧？但是我担心构建路线系统会花费太多时间，而且时间也应该平衡到我的等式中。

如果这个问题令人困惑，我很抱歉：我只想知道使用 Backbone.js 并节省时间的最佳实践。

【问题讨论】：

标签： javascript html templates backbone.js

【解决方案1】：

两者各有利弊，所以我想说的是：根据您的要求选择最适合您的选项。

我不知道 Backbone.js，所以我将保留我对客户端渲染与服务器端渲染的回答。

客户端渲染

这种方法允许您在服务器端快速渲染结构，然后让用户的 JavaScript 获取实际内容。

优点：

更快的用户体验：如果在初始渲染中有足够的静态内容，那么用户可以更快地返回他们的页面（或至少是它的开头），并且他们不会为动态内容而烦恼，因为它很可能也会以相当快的速度呈现。
更好地控制缓存：通过要求浏览器发出多个请求，您可以将服务器设置为对每个 URL 使用不同的缓存标头，具体取决于您的要求。通过这种方式，您可以允许用户缓存初始页面呈现，但要求用户每次都获取动态（变化的）内容。

缺点：

用户必须启用 JavaScript：这是一个显而易见的问题，我什至不需要提及它，但如果您不提供，您将削减（非常小的）一部分用户群一个优雅的替代您的 JS-heavy 网站。
复杂性：这有点主观，但在某些方面，将所有内容都使用服务器端语言会更简单，并且不需要太多的来回操作。当然，它可以是双向的。
后处理慢：这取决于浏览器，但事实是，如果在检索动态内容后需要进行大量 DOM 操作或其他后处理，让如果服务器未充分利用，请执行此操作。大多数浏览器都擅长基本的 DOM 操作，但如果您必须进行 JSON 解析、排序、算术等，其中一些在服务器上可能会更快。

服务器端渲染

这种方法允许用户一次接收所有内容，也适合没有良好 JavaScript 支持的浏览器，但这也意味着在浏览器获得第一个 <html> 标记之前，所有内容都需要更长的时间。

优点：

内容同时出现：如果您的服务器速度很快，它会一次性渲染所有内容，仅此而已。没有乱七八糟的 XmlHttpRequest（还有人直接使用它们吗？）。
快速后处理：就像您不希望应用程序层对数据库查询集进行排序一样，因为数据库更快，您可能还希望在服务器上保留大量处理 -边。如果您针对客户端方法进行设计，则很容易忘乎所以并将处理放在错误的位置。

缺点：

感知用户体验变慢：在服务器完成所有工作之前，用户将无法看到单个字节。当然，服务器可能会快速通过它，但在用户方面仍然需要几秒钟的时间，您可以通过立即渲染来帮他们一个忙。
由于服务器在请求上花费更多时间而无法扩展：您可能真的希望服务器快速完成请求并继续进行下一个连接。

其中哪些对您的要求最重要？这应该会影响您的决定。

【讨论】：

【解决方案2】：

我不了解骨干网，但这里有一个简单的想法：如果可能且安全，请在客户端而不是服务器上执行所有操作。这样，服务器要做的工作就更少了，因此可以处理更多的连接并更好地扩展。

【讨论】：

【解决方案3】：

但是#1 比#2 复杂得多。

不是真的。一旦你掌握了 Backbone 和 jQuery 以及客户端模板的窍门（也可能将 CoffeeScript 加入其中），那么这并不难。事实上，它极大地简化了您的服务器代码，因为所有与显示相关的功能现在都被删除了。您甚至可以在同一台服务器上运行不同的客户端（例如移动版）。

即使关闭了 javascript，项目仍然会显示，因为服务器通过模板引擎呈现它。

这是这里的重要考虑因素。如果你想支持没有 Javascript 的用户，那么你需要一个非 JS 版本。

如果你已经有一个非 JS 版本，你可以考虑是否还需要“增强”版本，如果需要，如果你想重用你已经编码和测试过的服务器端模板并且无论如何都需要维护，或者在客户端重复工作，这会增加开发成本，但正如您所说，可能会提供卓越的体验并降低服务器上的负载（尽管我无法想象获取渲染数据与获取 XML 数据相比差别很大）。

如果你不需要支持没有 Javascript 的用户，那么一定要在客户端渲染。

【讨论】：

【解决方案4】：

我认为 Backbone 的目标是组织一个 Javascript 页面内客户端应用程序。但首先你应该对下一个陈述持立场：

即使关闭了 javascript，网络应用程序仍可在“回发模式”下运行。

这是您的要求之一吗？（这不是一个简单的要求。）如果不是，那么我会建议你：“多做 JS”。但如果是，那么我相信你最好的朋友是jQuery load function。

注意：我是一名 Java 程序员，并且有许多服务器端框架能够编写在启用 js 时以 ajax 方式运行的应用程序，并在未启用时打开回发。我认为Wicket 和Echo2 是其中的两个，但这意味着它们是服务器端库...

【讨论】：