javascript - 如何构建优雅降级的 AJAX 网页？

Question

我想用“优雅降级”构建网页。也就是说，网页功能即使禁用了 javascript。现在我必须对 AJAX 响应的格式做出设计决定。

如果 javascript 被禁用，每个对服务器的 HTTP 请求都会生成 HTML 作为响应。浏览器刷新返回的 HTML。没关系。

如果启用了 javascript，每个发送到服务器的 AJAX HTTP 请求都会生成……好吧，JSON 或 HTML。

如果是HTML，很容易实现。只需使用 javascript 将部分页面替换为返回的 HTML。而且，在服务器端，不需要太多代码更改。

如果它是 JSON，那么我必须再次在 javascript 中实现 JSON 到 html 的逻辑，这几乎是服务器端逻辑的重复。 复制是邪恶的。我真的不喜欢它。好处是带宽使用比 HTML 更好，从而带来更好的性能。

那么，优雅降级的最佳解决方案是什么？ AJAX 请求返回 JSON 还是 HTML 更好？

Answer 1

我认为任何给定情况都没有“最佳解决方案”。也许只是针对特定问题的“适当解决方案”。这真的取决于你想做什么。优雅的降级对我来说意味着:

• 构建一个“足够好”的界面，可以在尽可能多的浏览器(桌面和移动设备)上运行。
• 不引人注意地添加一些脚本(验证方法、界面元素，如选项卡和 slider 等)，只有当加载页面的浏览器具有使它们正常工作所需的功能时，这些脚本才会出现。

在服务器响应中使用 HTML 还是 JSON 是非常主观的，我经常发现自己很难在它们之间做出选择。有人可能会争辩说，例如，从服务器接收一堆键值对并将它们呈现到现有的选择元素中将意味着更多代码，因此会花费更多编码时间和更多潜在错误。相反，您可以简单地从服务器请求预构建的 select 元素，并将其注入(inject)到容器中。构建元素的逻辑已经驻留在服务器上，为什么要用两种不同的语言构建两次。

另一个观点是 JSON 最大限度地减少了带宽使用，因此值得付出额外的努力来解析一些 JSON 以在客户端上构建一些标记。我发现很容易不同意这种观点，原因有几个(我不是一概而论，不要误会我的意思)。首先，很多很多网络服务器被配置为压缩/缩小/gzip 其输出，并且很多很多浏览器接受压缩内容。标记是极度可压缩的，因为它包含大量冗余 (<strong></strong>)。因此，有理由认为 JSON 响应的大小不会比带有标记的响应小很多。其次，大型数据集可能意味着客户端的执行时间相当长(讨厌的嵌套循环很常见——在此处弹出的一些问题中很明显)。

我对您的建议是尝试了解每种方法的优点和缺点，并利用这些信息。您可能想阅读以下内容:

http://www.quirksmode.org/blog/archives/2005/12/the_ajax_respon.html