Json只有网络应用程序.有什么缺点？(或优点)

Question

我想设计一个Web应用程序,其唯一的接口是json,即所有的http请求只接收以json格式的响应,并且不在服务器端呈现任何html.所有表单帖子都将表单数据转换为json对象,然后将其作为字符串发布.所有渲染都是由客户端javascript完成的.

我知道这种方法的一个缺点是没有javascript的浏览器不能对这种架构做很多事情,但是网站上的交互很丰富,无论如何对非JavaScript浏览器都没用.

这种设计Web应用程序的方法还有其他缺点吗？

Answer 1

这是一种越来越常见的模式,使用GWT和ext-js等工具.像GMail这样的复杂网络应用程序已经有超过90%的JS创建DOM一段时间了.如果您正在开发一个传统的"期刊"类型的网站,主要是要阅读的书面内容,这种方法将是过度的.但对于希望避免页面刷新的复杂应用程序,它可能是合适的.

一个缺点是它不仅需要一个支持JavaScript的浏览器,而且应用程序所需的计算资源也很容易爬到它需要相当强大的浏览器的程度.如果您在顶级PC上使用Chrome进行开发,您可能会在功能较弱的计算机(如上网本或移动设备)上运行应用程序,并发现它已变得相当迟缓.

另一个缺点是你在页面上工作时失去了使用HTML工具的机会,并且在Firebug或Chrome开发者工具下查看应用程序页面的DOM树可能很难,因为元素和代码之间的关系可能不太清楚.

编辑:要考虑的另一件事是,使页面更易于访问是更多的工作,因为可能必须添加键盘快捷键(您可能无法使用此处内置的浏览器),有特殊需求的用户可能会发现更多难以改变应用程序的外观,例如通过增加字体大小.

另一个编辑:现在不太可能搜索引擎成功抓取您网站上的文字内容.出于这个原因,您有时会看到服务器创建的仅文本页面表示相同的内容,这些页面将浏览器引用到启用JS的页面版本.

Answer 2

除了你指出的问题,还有另外一个:速度.但它不一定是一个大问题,实际上使用JSON而不是HTML可能(通过较慢的连接)改善而不是阻碍速度.

Web浏览器经过高度优化,可以呈现HTML,包括整个页面(例如,通常)和片段(例如,innerHTML以及它的各种包装,如jQuery html或Prototype update).有很多可以做,以减少通过您返回的数据工作,并呈现结果的速度冲击,但没有将是相当快,从服务器上抓取一些HTML标记,并将其倾倒到浏览器中进行显示.

现在,那说,它根本不一定是一个大问题.如果您使用有效的技术(本文中的一些注释),并且如果您主要通过构建HTML字符串来呈现结果,那么您将转移给浏览器(再次,通过innerHTML或包装它),或者如果您是一次只渲染几个元素,不太可能存在任何明显的速度差异.

相反,如果通过DOM API或包装器创建和附加单个元素来构建实质树,则很可能会注意到性能影响.这似乎是正确的事情,但它涉及到跨DOM/JavaScript边界的大量旅行,并且意味着浏览器必须在所有中间步骤中向您的代码呈现DOM版本的东西; 相比之下,当你把它变成一个HTML字符串时,它可以完成它的事情,并全速前进.您可以在此性能测试中看到差异.这很重要.

在较慢的连接中,如果JSON数据比HTML本来更紧凑,则可以弥补甚至克服速度影响,因为线路上的尺寸较小.

Answer 3

当你构建这样的东西时,你必须更加注意高延迟,低带宽连接.可能的情况是,您将要进行大量的Ajax调用以同步数据并从服务器获取新数据,如果存在大量延迟,则滞后可能会很明显.您需要制定策略,以便让用户了解客户端和服务器之间的任何通信进度.

在开发过程中,这是可以忽略的,特别是如果您正在使用本地Web服务器,但它可能会在生产中成为杀手.这意味着要研究预取和缓存策略.

您还需要一种有效的方法来管理HTML片段/模板.显然,有一些很好的模块用于渲染模板--Mustache.js,Underscore模板等 - 但是保持在HTML片段之上可能会导致一些维护问题.我倾向于将HTML模板存储在单独的文件中,并通过Ajax调用动态加载它们(加上缓存以最小化HTTP请求).

编辑 - 另一个骗局:

数据同步 - 如果您使用服务器数据库作为数据"权限",那么保持服务器和客户端之间的数据同步非常重要.如果对一个客户端上的数据的更改影响多个客户端,则这更加相关.然后,您将进入处理实时异步更新的领域,这可能会导致一些有趣的概念性挑战.(幸运的是,使用诸如Socket.IO和Backbone.js之类的框架和库可以使事情变得更容易).

编辑 - 专业人士:

这类应用程序有一些巨大的优势 - 响应速度更快,可以真正增强用户体验.现在可以快速无缝地执行通常需要往返服务器并产生网络开销的微不足道的操作.

此外,它还允许您更有效地将数据耦合到您的视图.如果你在客户端处理数据,你可能会有一个框架,允许你组织数据并使用ORM - 无论是Backbone.js,Knockout.js还是类似的东西.您不再需要担心将数据存储在html属性或临时变量中.一切都变得更易于管理,并为一些非常复杂的UI开发打开了大门.

此外,JavaScript为事件驱动的交互开辟了可能性,这是高度交互式应用程序的完美范例.通过使用事件循环,您可以将数据直接挂钩到用户启动和自定义事件,这开辟了很多可能性.通过将数据模型直接挂接到用户驱动的事件,您可以稳健地处理数据的更新和更改,并以最小的麻烦呈现适当的输出.这一切都发生在高速.