javascript - 如何减少客户端和服务器之间的 View 重复？

Question

我正在从事一个 AJAXy 项目(Dojo 和 Rails，如果需要的话)。用户应该可以在几个地方对结果进行排序、分组和过滤。还有一些地方，用户可以填写一个简短的表格，然后将生成的项目添加到同一页面上的列表中。

非 AJAXy 实现工作正常—— View 层服务器端已经知道如何呈现这些东西，因此它可以以不同的顺序或使用额外的元素再次进行。然而，这给服务器增加了很多负担。

因此我们转而从服务器发送 JSON 并在客户端进行大量(重新)渲染。缺点是现在我们有重复的代码来呈现每个页面:一次是在 Rails 中，它是为此而构建的，一次是在 Dojo 中，但不是。后者基本上只是字符串连接。

那么第一个问题:是否有一个好的 Javascript MVC 框架可以用来使客户端的渲染更易于维护？

问题第二部分:有没有办法从同一个模板生成 Javascript 中的客户端 View 和 ERB 中的服务器端 View ？我认为这就是务实程序员会做的事情。

或者，问题第三部分:我是否完全错过了另一个 Angular ？也许从服务器发送 JSON，但也包括 HTML 片段作为属性，以便 Javascript 可以进行过滤、排序等，然后只插入给定的片段？

Answer 1

好吧，每次您在客户端和服务器上生成 HTML 片段时，您最终可能会得到重复的代码。一般没有很好的解决办法。但是你可以做两件事:

1. 在服务器上生成所有内容。使用 AHAH当您需要动态生成 HTML 片段时。基本上，您要求服务器生成一个 HTML 片段，异步接收它，然后使用 innerHTML 或任何其他类似机制将其插入到位。
2. 在客户端生成所有内容(又名胖客户端范例)。在这种情况下，即使对于初始呈现，您也传递数据而不是预呈现的 HTML，并使用 JavaScript 在客户端处理数据以生成 HTML。根据情况，您可以使用数据岛技术，或异步请求数据。变体:使用 JSONP 将其包含为 <script>因此浏览器会在加载页面时为您发出请求。

这两种方法都非常简单，并且各有优缺点。有时可以在一个 Web 应用程序中针对不同的数据部分结合这两种技术。

当然，您可以寻求奇特的解决方案，例如使用一些基于 JavaScript 的服务器端框架。在这种情况下，您可以在服务器和客户端之间共享代码。