Question

我有一个相当ajax的重型网站，并且从ajax请求中将一些3k html格式的页面插入到DOM中。

我一直在做的是使用html响应并使用jQuery插入整个内容。

我的另一个选择是输出xml（或可能是json），然后解析文档并将其插入页面。

我注意到似乎大多数大型网站都采用json / xml方式。 Google Mail会返回xml而非格式化的html。

这是出于性能吗？还是有另一个理由使用xml / json vs只检索html？

从javascript的角度来看，它似乎注入直接html是最简单的。在jQuery中我只是这样做

jQuery.ajax({
    type: "POST",
    url: "getpage.php",
    data: requestData,
    success: function(response) {
        jQuery('div#putItHear').html(response);
    }

我需要做xml / json响应

jQuery.ajax({
    type: "POST",
    url: "getpage.php",
    data: requestData,
    success: function(xml) {
        $("message",xml).each(function(id) { 
            message = $("message",xml).get(id); 
            $("#messagewindow").prepend("<b>" + $("author",message).text() + 
            "</b>: " + $("text",message).text() + 
            "<br />"); 
        });
    }
});

从代码的角度来看，显然效率不高，而且我不能指望它的浏览器性能更好，为什么第二种方式呢？

Answer 1

与返回HTML相比，返回JSON / XML为应用程序提供了更多的自由，并且在不同的字段（数据与标记）中需要较少的特定知识。

由于数据仍然只是数据，因此您可以选择如何将数据显示到客户端。这允许在客户端而不是在服务器上执行许多代码 - 服务器端只需要知道数据结构而不需要知道标记。程序员需要知道的是如何提供数据结构。

客户端实现只需要知道如何显示服务器返回的数据结构，而不需要担心这些结构如何实际构建。程序员需要知道的是如何显示数据结构。

如果要构建另一个客户端（不使用HTML作为标记语言），则可以重用所有服务器组件。构建另一个服务器实现也是如此。

Answer 2

通常会减少传输的数据量，从而提高传输速度。由于任何线上通常都是流程中的瓶颈，缩短传输时间将减少执行流程所需的总时间，从而改善用户体验。

Answer 3

以下是发送JSON / XML而不是HTML的一些优点：

如果数据将在您的应用程序之外使用，则HTML可能更难以解析并适合其他结构
JSON可以直接嵌入script标签，允许跨域AJAX场景
JSON / XML保留了服务器端脚本和视图之间关注点的分离
降低带宽

Answer 4

你应该看一下模板工具Pure 从JSON数据生成HTML。

Answer 5

通常，JSON是一种通过ajax检索数据的更有效方法，因为XML中的相同数据要大得多。客户端Javascript也更容易使用JSON。但是，如果您正在检索纯HTML内容，我可能会按照您的建议进行操作。虽然，如果你真的需要，你可以将你的HTML内容嵌入到JSON字符串中，并充分利用这两个世界

Answer 6

我目前正在努力解决这个问题，直到我看到达林如何将其贬低之后，我才开始点击它：

“如果数据将在您的应用程序之外使用，则HTML可能更难以解析并适合其他结构”

我认为很多是数据的来源/方式。如果它是一个不需要在其他地方共享/发送数据的一次性应用程序，那么吐出纯HTML就好了，即使它确实更重要。

就个人而言，如果有复杂的HTML要包装数据，我只是吐回HTML并将其放入.jQuery很可爱，但是用Javascript构建HTML通常很痛苦。但这是一场平衡游戏。

Answer 7

在某些情况下，AJAX响应需要返回的信息不仅仅是要显示的HTML。例如，假设您要从搜索中返回前20个项目的列表。您可能需要返回要在DOM中的其他位置显示的搜索结果总数。您可以尝试在隐藏的div中捎带总计数，但这可能会变得混乱。使用JSON，总计数可以简单地为字段值，即结构化JSON响应。

Answer 8

对我来说，归结为：

对于我们中的许多人来说，使用我们已经习惯的服务器端，成熟的模板引擎，生成html并将其发送到管道，而不是使用一堆javascript代码来生成HTML客户端的工作要少得多侧。是的，现在有一些javascript的模板引擎可能会有所缓解。

由于我已经将模型，逻辑和视图服务器端分开，因此没有任何争论可以进行另一次分离。 JSON是一个视图，HTML是另一种视图。

让我们面对它; HTML / AJAX和JSON / AJAX都比管道上的整页好很多倍。

您可能需要考虑的最后一件事是;如果你将成为搜索引擎友好的 - 你可能必须以任何方式生成HTML服务器端（旧的降级优雅的口头禅）。

我通常会做一个组合。如果有客户端逻辑，我使用JSON - 否则我使用HTML。通知和自动填充特殊字段通过JSON发送。

ajax html vs xml / json响应 - 性能或其他原因

8 个答案: