Question

最近，我提出了一些关于如何提高整体性能的想法一个Web应用程序，而不是从Web服务器生成一个准备好的html页面，为什么不让它在客户端完全生成。这样做，只需要将纯数据（在我的情况下是JSON格式的数据）发送到浏览器。这将把html生成的工作从服务器卸载到客户端的浏览器和减少发送回用户的响应数据包的大小。

经过一番研究，我发现这个框架（http://beebole-apps.com/pure/）做与我相同的事情。

我想知道的是这样做的利弊。对于Web服务器来说肯定更快更好，并且使用现代浏览器，Javascript代码可以快速运行，因此可以快速完成页面生成。

这种方法的缺点可能是SEO。我不确定像谷歌这样的搜索引擎是否会适当地索引我的网站。 你能否告诉我这种方法的缺点是什么？

Ps：我还附上了示例代码，以帮助描述如下方法：

在头脑中，简单的javascript代码将按如下方式编写：

<script type='javascript' src='html_generator.js'/>
<script>
   function onPageLoad(){
      htmlGenerate($('#data').val());
   } 
</script>

在正文中，只存在一个元素，仅用作数据容器，如下所示：

  <input type='hidden' id='data' value='{"a": 1, "b": 2, "c": 3}'/>

当浏览器呈现文件时，将调用html_generator.js中的htmlGenerate函数，并在此函数中生成整个html页面。请注意，html_generator.js文件可能很大，因为它包含许多html模板，但由于它可以在浏览器中缓存，因此只会下载一次。

Answer 1

缺点

搜索引擎无法为您的网页编制索引。如果他们这样做，那你很幸运。
禁用JavaScript或移动设备的用户很可能无法使用它。
速度优势可能会变得极小，特别是如果用户使用IE中的慢速JavaScript引擎。
可维护性：除非你自动生成你的javascript，否则它将成为一场噩梦！

总而言之

如果您只是为了提高速度而不建议使用此方法。但是，它通常在Web应用程序中完成，其中用户保持在同一页面上，但是您可能最好使用其中一个现有框架，例如backbone.js，并确保它仍然可以通过关注Google's hashbang guidelines或HTML5 PushState（由@rohk建议）。

如果它只是您正在寻找的性能，并且您的应用并不需要像这样工作，请不要这样做。但如果你这样做，那么请确保你以标准化的方式进行，以便它保持快速和可索引。

Answer 2

客户端模板通常用于Single Page Applications。

你必须权衡利弊：

优点：

更具响应性的界面
在您的网络服务器上减少负载

缺点：

SEO比传统网站更难（除非你使用HTML5 PushState）
辅助功能：您非常依赖javascript ...

如果您这样做，我建议您查看Backbone.js。您可以在此处找到教程和示例：http://www.quora.com/What-are-some-good-resources-for-Backbone-js

SPA的例子：

另请看这个答案：https://stackoverflow.com/a/8372246/467003

Answer 3

让人惊讶。

jQuery模板更接近您的想法。 Sanity说你应该有一些HTML模板，你可以随意轻松修改。你想要MAINTAINABILITY不是字符串连接，让你在最糟糕的噩梦中辗转反侧。

你可以继续这种疯狂，但你最终会以艰难的方式学习。我雇用你首先尝试使用jQuery模板和纯代码方式的一些原型。理智肯定会克服你我的朋友，我说这是来自尝试你的方式一段时间。：）

可以使用AJAX动态加载您需要的模板内容。没有任何意义，你将有一个灵丹妙药的方法，在一个请求中需要下载每个可想到的模板。

Answer 4

职业选手？我真的想不出来。你说它在网络服务器上会更容易，但提供HTML是设计用来做的。

缺点？在构建网站时，它几乎与每一个最佳实践相悖：

搜索引擎无法为您的网站编制索引（如果有的话）
降低可维护性
无论JS引擎有多快，DOM都很慢，而且永远不会像在服务器上构建HTML一样快
一个JS错误，您的整个网站都无法呈现。哎呀。然而，浏览器极其容忍HTML错误。

最终，HTML是展示内容的绝佳工具。 JavaScript是添加交互的好方法。像你建议的那样把它们混合起来只是坚果而且只会引起问题。

Answer 5

<强>缺点

SEO
不包含javascript的用户

<强>赞成

更快的工作流程/ Fluider界面
小负荷减少

如果搜索引擎优化对您不重要，并且您的大多数用户都有Javascript，则可以创建Single Page Applications。它不会减少你的负担，但它可以在页面上创建更快的工作流程。

顺便说一句：我不会将所有模板打包在一个文件中。这对于大型项目来说太大了。

使用javascript完全生成html的优点和缺点

5 个答案:

缺点

总而言之