客户端模板的优点是什么（类似小胡子）答案

【问题标题】：What are the advantages of client-side templating (mustache-like)客户端模板的优点是什么（类似小胡子）
【发布时间】：2012-11-07 14:08:02
【问题描述】：

为了避免编写为动态页面手动生成 HTML 的 JavaScript 代码（不仅丑陋，而且根本不 DRY），并考虑到简单和优雅（相对于性能），有什么优点在客户端使用基于字符串的模板，例如 Mustache.js 或 Handlebars.js，分别检索 json 数据和模板，而不是使用检索服务器端呈现的 html 片段的 REST API？

我的印象是客户端模板是在动态页面上保持简单的最佳方法，但在使用了一段时间后，我发现维护这样的页面有点复杂，它的主要优点是更好的性能和带宽使用，这通常不是我的主要目标。

【问题讨论】：

标签： mustache templating client-side-templating

【解决方案1】：

我目前正在使用 Twitter 的 Hogan 库，在此之前我使用的是 Trimpath 库。我是客户端模板的忠实信徒；但它们不应该被滥用。这里有几个论点：

就像服务器端模板一样，它有助于区分应用程序逻辑和表示。与在运行时手动创建 DOM 元素的层次结构不同，使用 HTML 定义模板并使用来自 javascript 的数据呈现它可以创建更具可读性和优雅的代码。
我发现使用客户端模板来重复层次结构（如 twitter 帖子、博客条目、新闻文章等）是很实用的......服务器只发送 JSON 数据，（大部分时间通过 AJAX 调用)，并且可以立即将数据绑定到模板。
我使用的模板引擎更新了带有生成的 HTML 字符串的 innerHTML。据说这比 DOM 操作更快，但我自己从未运行过基准测试。
桌面应用程序和 RIA 可以从客户端模板中受益匪浅。他们可以在不依赖第三方解决方案的情况下驱动他们的界面。
我们可以很容易地在我们的项目中拥有服务器端模板和客户端模板。他们可以很好地合作。在 web 项目中，我不建议我们将模板移植到客户端，只从服务器发送数据。例如，我使用带有 INCLUDE 语句的服务器端模板来构建整个页面。一个模板可以包含另一个模板结构来构建界面。对于客户端模板来说，这是一项复杂的任务，只会产生不必要的代码和开销。

【讨论】：

你在服务器和客户端使用相同的模板引擎吗？
暂时没有。但 Hogan 和 mustache 模板可用于 node.js
我不喜欢仅仅为了渲染模板而去 node.js 的想法。无论如何，Mustache 在每种主要语言中都可用，所以这不是问题。尽管如此，当使用后端呈现的模板（通过 ajax 调用）更新客户端时，您在客户端模板中提到的大多数优势也可以获得。我看到在客户端呈现的唯一充分理由（除了性能考虑因素）是服务器上的纯数据 api 往往更具可重用性和呈现解耦。